jquery不选择jquery添加元素

所以我有一个jquery函数，在单击类’ajaxsubnote’时会执行某些操作

$('.ajaxsubnote').click(function(){ //do something.... }) 

但是用户可以通过jquery动态添加类’ajaxsubnote’的元素。 我的问题是这些动态添加的元素，当点击时，似乎没有调用上面的函数，而最初在DOM上的元素做…

有什么方法吗？

Answer 1

您应该使用委托事件方法来处理动态元素。 见下文，

 // v--- replace document with closest parent container that exist in DOM $(document).on('click', '.ajaxsubnote', function(){ //do something.... }) 

对于旧版本，请使用委托，

 // v--- replace document with closest parent container that exist in DOM $(document).delegate('.ajaxsubnote', 'click', function(){ //do something.... }) 

Answer 2

绑定/单击事件和委托事件之间的区别非常重要。

当您使用bind或快捷方式（例如click）时，它会将指定的事件绑定到当时与特定选择器匹配的所有元素。 此选择器是及时的快照，在添加新元素时不会更新。

使用事件委派时，您提供静态父选择器，然后提供动态元素选择器。 现在，当您单击父选择器中的任何位置时，jQuery将检查目标是否与父选择器匹配。 如果目标与第二个选择器匹配，则触发事件。 这意味着您可以向父内容部分添加和删除与事件触发条件匹配的元素，而无需每次都绑定事件。

http://api.jquery.com/on/

所以你需要的是：

 $(parentElement).on( "click", ".ajaxsubnode", function(){ //do something.... }); 

其中parentElement尽可能具体，同时仍然是所有可能的ajaxsubnode类的父级。

Answer 3

您需要使用on()函数来委派click事件

 $("dynamicContainerElement").on("click", "dynamicallyAddedElement", function () { /* Your code here */ }); 

http://api.jquery.com/on/