首页 >web前端 >js教程 >如何使用 jQuery 将事件处理程序附加到动态添加的元素?

如何使用 jQuery 将事件处理程序附加到动态添加的元素?

Patricia Arquette
Patricia Arquette原创
2025-01-05 11:10:43213浏览

How to Attach Event Handlers to Dynamically Added Elements with jQuery?

如何使用 jQuery 将事件绑定到动态元素

假设您有现有的 jQuery 代码,将事件处理程序附加到类 .myclass 的元素。但是,在通过 AJAX 或 DHTML 动态添加这些元素到页面的情况下,新创建的元素将不会有与其关联的点击处理程序。

问题解决方案

为了解决这个问题,jQuery 提供了几种方法:

1. .on() 方法 (jQuery 1.7 ):

用 .on() 替换 .live() 方法,并指定一个将父元素与 .myclass 作为参数组合的选择器。

$('body').on('click', 'a.myclass', function() {
    // do something
});

这会将点击处理程序附加到所有 具有 .myclass 类的标签,无论它们何时添加到页面。

2. .delegate() 方法 (jQuery 1.6 - 1.8):

.delegate() 方法的作用与 .on() 类似,但需要在括号中指定父元素:

$('body').delegate('a.myclass', 'click', function() {
    // do something
});

.on() 和 .delegate() 都允许对动态添加的元素进行事件处理。

以上是如何使用 jQuery 将事件处理程序附加到动态添加的元素?的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn