1

コードが機能しない理由を理解するのに苦労しています。テキスト フィールド、2 つのチェックボックス、追加ボタンが並んだテーブルがあります。読み込み時に 4 行あります。クリックするとハイパーリンクが表示され、テーブルの最後に新しい行が追加されます。私のコードは、最初の行から交互に行を追加しています。私の最後の行は、私が複製している 4 です。リンクをクリックすると得られるシーケンス 1,4,2,4,3,4,4,4

どこで間違いを犯しているのかわかりません。過去 4 ～ 5 時間、この問題に頭を悩ませていました。

<table id="setting">
<tr><td><input name="name_1" type="text" /></td>
<td><input type="checkbox" /> </td>
<td><input type="checkbox" /> </td>
<td><input type="button" /></td></tr>
<tr><td><input name="name_2" type="text" /></td>
<td><input type="checkbox" /> </td>
<td><input type="checkbox" /> </td>
<td><input type="button" /></td></tr>
<tr><td><input name="name_3" type="text" /></td>
<td><input type="checkbox" /> </td>
<td><input type="checkbox" /> </td>
<td><input type="button" /></td></tr>
<tr><td><input name="name_4" type="text" /></td>
<td><input type="checkbox" /> </td>
<td><input type="checkbox" /> </td>
<td><input type="button" /></td></tr>
</table>

$('#add').on("click", function(e) {
     e.preventDefault();
     e.stopPropagation();
     $clone = $('#settings tbody tr').filter(":last").clone(true).insertAfter('#settings tbody tr').filter(":last").val('');

以下のコードを、stackoverflow の質問の 1 つから試しました。これは私にはうまくいきませんでした、理由はわかりません

$('#settings tbody tr:last').clone(true).insertAfter('#settings tbody>tr:last');
$('#settings tbody tr:last').val('');
4

2 に答える 2

2

マークアップにはありませんがtbody、jQuery で使用しています。

<table id="setting">
   //<-----------------------missing tbody here
  <tr>
     <td><input name="name_1" type="text" /></td>
     .................

$('#<portlet:namespace />settings tbody tr:last')
      //--------------------------^^^^^------------its not there

代わりに、これを試すことができます：

$('#<portlet:namespace />settings tr:last')

アップデート：

 $('#settings tbody tr')
 //---------^-----------------this makes the mess

間違った ID が選択されました。setting代わりに使用してsettingsください:

 $('#setting tr:last-child').clone().insertAfter('#setting tr:last');

このフィドルをチェックアウト

別の更新:

 $('#add').click(function (e) {
      var $cln = $('#setting tr:last-child').clone();
      $cln.find(':text').attr('id', 'textbox' + $('#setting tr:last-child').index()).val('');
      $cln.find(':checkbox').each(function (i, v) {
          $(this).attr('id', 'check' + $('#setting tr:last-child').index() + i).prop('checked', false);
      });
      $cln.find(':button').attr('id', 'btn' + $('#setting tr:last-child').index());
      $cln.insertAfter('#setting tr:last');
      console.log($cln.find(':text').attr('id') + '<===>' + $cln.find(':checkbox:eq(0)').attr('id') + '<===>' + $cln.find(':checkbox:eq(1)').attr('id'));
 });
于 2013-03-21T05:55:28.990 に答える
1 
$('#setting tr:last-child').insertAfter('<tr><td><input type="button" /></td></tr>');

また 

$('#setting tr:last-child').after('<tr><td><input type="button" /></td></tr>');

.after() 説明: 一致した要素のセット内の各要素の後に、パラメーターで指定されたコンテンツを挿入します。

このフィドルをチェックしてください：jsfiddleと更新されたフィドル

$('#add').on("click", function (e) {
    e.preventDefault();
    e.stopPropagation();
    $('#setting tr:last-child').after('<tr><td><input name="name_4" type="text" /></td>td><input type="checkbox" /> </td><td><input type="checkbox" /> </td><td><input type="button" /></td></tr>');
    return false;
});
于 2013-03-21T05:49:03.643 に答える