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

【问题标题】：Adding elements to the DOM via ajax and keeping jQuery connected通过 ajax 向 DOM 添加元素并保持 jQuery 连接
【发布时间】：2015-07-18 11:21:01
【问题描述】：

如果通过 AJAX 添加到 DOM 的元素似乎没有附加相关的 jQuery.on() 处理程序，我总是会遇到问题。所以我最终在 AJAX 完整函数中重新添加了事件。

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

【问题讨论】：

【解决方案1】：

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

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

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

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

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

【讨论】：

【解决方案2】：

您使用的是什么版本的 jQuery？

以前，在 1.9 之前，有一个 jQuery.live() - API docs link 用于向 DOM 中尚不存在的元素添加事件处理程序。但由于 1.7 jQuery.on() - API docs link 的工作方式相同。

【讨论】：

【解决方案3】：

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

【讨论】：