点击事件不会触发动态添加表行(Click event doesn't fire for ta

我有一个空表到我通过使用jQuery添加行：

$('#table > tbody:last').append('<tr id="' + symbol.Code1 + '"><td>' + symbol.Code1 + '</td><td>' + symbol.Code2+ '</td><td>' + symbol.Code3+ '</td></tr>');

一切都OK了，但是当我执行：

$("#table tr").click(function(e) {
    alert(this.id);
});

什么都没发生。

Answer 1:

你需要的事件代表团 ，您可以使用上点击事件绑定动态添加元素。 您正在使用点击结合的方式将适用于现有的这些后来添加的元素 ，但不是元素。

$(document).on("click", "#table tr", function(e) {
    alert(this.id);
});

您可以将范围限制为on给予或者通过ID或父类最接近父选择。

$('.ParentElementClass').on("click", "#table tr", function(e) {
    alert(this.id);
});

委托事件

委托事件有优势，他们可以处理来自被添加到该文件在稍后的时间后代元素的事件。 通过挑选这是保证出席委派的事件处理程序连接时的元素，你可以使用委托的事件，以避免需要频繁安装和取下事件处理程序。

Answer 2:

你必须使用的.on方法

$("#table").on('click','tr',function(e) { 
    alert($(this).attr('id')); 
}); 

Answer 3:

你已经绑定事件到现有的动态后添加行。 您可以使用委派事件的方法来解决这个问题：

$("#table").on("click", "tr", function(e) {
    alert(this.id);
});

Answer 4:

$(document).on('click', "#tbl-body tr td", function(e) { 
    alert(this.id);
});

文章来源: Click event doesn't fire for table rows added dynamically