通过 ajax 向 DOM 添加元素并保持 jQuery 连接

Question

我一直遇到这样一个问题，即通过 AJAX 添加到 DOM 的元素似乎没有附加相关的 jQuery.on() 处理程序。所以我最终在 AJAX 完整函数中向它们重新添加了事件。

但我一直想知道 jQuery.on() 是否应该附在他们身上，如果是，那为什么不呢？

Answer 1

您使用的 jQuery 是什么版本？

以前，在 1.9 之前有一个 jQuery.live() - API docs link to add event handlers to the elements that did't exist in the DOM yet. But since 1.7 jQuery.on() - API docs link 以同样的方式工作。

Answer 2

你是如何使用on方法的？您使用的 jQuery 是什么版本？除了 on，您也可以使用 delegate。 here 是关于 delegate

的更多信息

Answer 3

jQuery 中有不同种类的事件绑定。

下面的代码将仅将 click 事件附加到当前可用的 DOM 元素，并且在删除或重新添加元素时，该事件将不再起作用

$(".myElement").on("click", function() {
    console.log("Clicked!");
})

下面的方法将在 DOM 的整个生命周期内将 click 事件附加到具有给定选择器的所有元素，而不管添加和删除元素的次数如何。

$(document).on("click", ".myElement", function() {
    console.log("Clicked!");
})

通过 ajax 向 DOM 添加元素并保持 jQuery 连接

Adding elements to the DOM via ajax and keeping jQuery connected

jquery

jquery-on

jquery-events