jQuery 事件处理：动态加载元素的 .live() 与 .on()？

动态 HTML 的事件处理：jQuery .live() 与 .on()

使用动态加载的 HTML 时，添加事件处理程序新创建的元素可能具有挑战性。这个问题探讨了 jQuery 的 .live() 和 .on() 方法之间的差异，用于将点击事件附加到动态加载的元素。

在 jQuery v1.7.1 中，.live() 已被弃用。相反，建议使用 .on() 来处理动态创建的内容的事件。然而提问者遇到了一种情况，.on() 无法为使用 $('#parent').load() 动态加载的元素注册点击事件。

这种场景的正确方法是事件委托，使用 .on() 实现。事件委托涉及将事件处理程序附加到加载动态内容之前存在的父元素。然后，事件处理程序被配置为侦听源自动态创建的元素的事件。

例如，将单击处理程序附加到动态加载到 #parent 中的 #child 元素：

$('#parent').on("click", "#child", function() {});

此方法允许事件处理程序捕获 #child 元素上的单击事件，即使在附加事件处理程序时这些元素不存在。这是因为单击事件向上冒泡到 #parent 元素，该元素为 #child 元素定义了事件处理程序。

事件委托解决了向动态创建的元素添加单击处理程序的问题，并且是推荐的方法使用动态加载的 HTML。

以上是jQuery 事件处理：动态加载元素的 .live() 与 .on()？的详细内容。更多信息请关注PHP中文网其他相关文章！