jquery - jquery遍历新创建的元素

Question

我正在尝试在我的表中添加新行，并将它们保存到数据库中。

首先，我使用 .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 必须是 unqiue（它是无效的 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!"; });