当我使用 AJAX 动态加载 jQuery 时,具有现有事件的元素会触发多次。
基本上我有一个名为“myjs.js”的文件,它包含我所有的 jQuery 并在页面加载时包含在内,因此为元素设置事件等。
现在,当用户触发发布新评论等事件时,它会发送(通过 Ajax)评论,然后返回包含新评论、编辑评论、回复等的页面。显然 myjs.js
是第一次加载它没有为新加载的元素创建任何事件。因此,我在使用 AJAX 返回的页面中包含 myjs.js
。
由于 myjs.js
已经加载到页面中,当返回包含 myjs.js
的 Ajax 页面时,它会向元素添加另一个事件已经加载了页面。
我已经试过了
$('*').unbind();
但这引起了一些奇怪的效果。
关于动态加载 jQuery 而不影响元素已经存在的任何事件有什么想法吗?
最佳答案
在没有看到 jQuery 代码的情况下,我怀疑用于绑定(bind)行为的选择器过于通用,所以正如您所发现的,所有现有元素加上新加载的元素每次都会匹配:
您可以在 AJAX 响应返回的 JavaScript 中使用更具体的绑定(bind),以仅向新加载的元素添加行为。
但是,为每个 AJAX 请求返回相同的 JavaScript 是低效的,因为浏览器无法缓存。理想情况下,您应该尝试在主页上加载 JavaScript 一次,然后依靠 jQuery 来执行 .live()
为新加载的元素自动绑定(bind)。这也称为事件委托(delegate) - .delegate()
请注意,从 jQuery 1.7 开始,这些方法已被弃用,取而代之的是更简洁的事件绑定(bind)基础结构 - .on()
关于javascript - jQuery 事件和双重触发?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8452402/