私はゲームに取り組んでおり、プレーヤーが情報を入力するためにテーブルをフォームとして使用しています。jQuery を使用して、プレイヤーの数を入力した後にボタンをクリックすると、名前ごとに新しいテキスト ボックスが表示されるようにしています。問題は、これらの入力フィールドをプレイヤー数入力ボックスの下の行に表示したいのですが、.after
jQuery 関数を使用すると、テーブルの一番上に直接移動してしまうことです。現在の行のすぐ下に行を作成してテーブルに追加するにはどうすればよいのか、または操作できる入力フォームのテーブル以外のメソッドに入力がある場合はどうすればよいのかと思っていました。.after
処理する関数とテーブルについて、私のコードの一部を添付しました。ご意見をお待ちしております。:)
<div class=form>
<table>
<tr>
<td>Gender:</td>
<td><form>
<input type="text" name="genderItem"/>
</form>
</td>
<td>
<div class ="button" id="button1">Add!</div>
</td>
</tr>
<tr>
<td>Number of charcters:</td>
<td><form>
<input type="text" name="charcItem"/>
</form>
</td>
<td> <div class="button" id="button2">Add!</div> </td>
</tr>
<div id="holder"></div>
</table>
$('#button2').click(function(){
names=$('input[name=charcItem]').val();
nameRecording(names);
});
function nameRecording(names){
for(var i =1; i<=names; i++)
$('#holder').after('<tr><td>Name one:</td><td><form><input type="text" name="charcItem"/></form></td></tr>');
};