我正在做一个项目，我想将同一类的许多元素添加到页面中，并使所有这些类都可以通过 $('selector').click(); 访问。事件处理程序。但是发生的情况是，同一类的动态添加的元素都没有响应点击。
为了让您更好地理解我的意思，我制作了一个示例 jsFiddle，它与我项目中的实际问题非常相似：
jsFiddle 链接：http://jsfiddle.net/8LATf/3/
“added_element”类的一个元素在加载时已经在页面上。这个元素是可点击的。
点击了一个按钮，它使用 append 动态地将“add_element”类的其他元素添加到页面中。这些元素都不可点击。
如何使“add_element”类的所有元素都可点击？我猜这与我在事件处理程序中使用的选择器有关，但我一直无法弄清楚。
非常感谢任何帮助！！！
【问题讨论】：
标签： jquery html css jquery-selectors jquery-click-event
You need to delegate your handler。最简单的方法是使用.on('click', ...) 将所有内容委托给document（这是.live() 在内部转换的方式，从jQuery 1.7 开始）：
$(document).on('click','.added_element',function() {
var id = $(this).attr('id');
alert(id);
});
http://jsfiddle.net/mblase75/8LATf/4/
但是，在您的情况下，您可以委托给#container，因为所有添加的元素都出现在其中。在可能的情况下，出于效率原因，最好委托给最接近的 DOM 元素。
$('#container').on('click','.added_element',function() {
var id = $(this).attr('id');
alert(id);
});
【讨论】：
这里需要使用事件委托，绑定事件的正确方法是：
$('#container').on('click', '.added_element', function() {
var id = $(this).attr('id');
alert(id);
});
【讨论】：
当您将事件处理程序附加到“added_element”时，通过脚本动态创建的事件处理程序不在 DOM 中。所以没有绑定到新创建的元素的事件处理程序。
要解决此问题，请将事件处理程序附加到包含 div，并使其查找“added_element”。
【讨论】：
.live 还是.on。每当您的链接失效时，您的答案就毫无用处。