尝试使用jQuery添加和删除表行 [英] Trying to add and remove table rows with jQuery

问题描述

我正在尝试使用jQuery添加和删除表行，添加的行包含一个删除链接，由于某种原因，它对生成的元素不起作用，即使我使用了。

I am trying to add and remove table rows with jQuery, added rows contain a remove link, which for some reason doesn't work on the generated elements, even though I use on.

这里是我的代码：

$("#target").click(function() {
$('#myTable tr:last').after('<tr><td>Bla</td><td><div class="remove">REMOVE</div></td></tr>');
});
$(".remove").on('click', function(event) {
  $(this).parent().parent().remove();
});

http://jsbin.com/ucopun/1/

可能是什么问题？

删除链接应该删除它所在的整行。

The remove link is supposed to remove the whole row in which it is located.

推荐答案

当你使用 on（），您仍然需要将事件绑定到页面上已存在的容器元素。我想这就是你想要的：

When you use on(), you still need to bind the event to a container element that exists on the page already. I think this is what you want:

$("#myTable").on('click', '.remove', function(event) {
  $(this).parent().parent().remove();
});

这篇关于尝试使用jQuery添加和删除表行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！