jquery - 新しく作成された要素を反復するjquery

Question

テーブルに新しい行を追加して、DB に保存しようとしています。

まず、.append() を使用してテーブルに行を追加します。

$("#tablename").append("<tr id='newRow'><td>newly added row</td></tr>");

追加機能は正常に機能します。マイページには正しい結果が表示されます。

ただし、それらを選択することはできません

$("#newRow").each(function () { alert "it never reaches here!"; });

DOMがロードされた後に要素が追加されるためだと思います。新しく追加されたすべての要素を反復処理する方法を教えてください。

ありがとうございました。

Answer 1

この場合は a を使用する必要がありclassます。ID は一意である必要があります (これは無効な HTML であり、そうでない場合は奇妙な動作が発生します)。

$("#tablename").append("<tr class='newRow'><td>newly added row</td></tr>");

$(".newRow").each(function () { alert "it never reaches here!"; });

Answer 2

ニックの方法は問題なく機能します。別の方法を次に示します。

$(function(){
  //add a class to mark the last row on load
  $('#tableName tr:last').addClass('lastRow');

  // ...

  // select new rows when you click save
  $('input:submit').click(function(){
     $('#tableName tr.lastRow').nextAll().each(function(){
        alert('added row');
     });
  });
});

Answer 3

新しい行をループするだけでよい場合は、次のようにします。

var rows = $("<tr class='newRow'><td>newly added row</td></tr>").appendTo('#tablename');
rows.each(function () { alert "it never reaches here!"; });