当我使用AJAX动态加载JQuery时,具有现有事件的元素会多次触发。
基本上我有一个名为'myjs.js'的文件,它保存了我的所有JQuery,并在页面加载时被包含,因此为元素设置事件等。
现在当用户触发发布新评论的事件时,它会发送(通过Ajax)评论,然后返回包含新评论,编辑评论,回复等的页面。当myjs.js
被发送时,很可能首先加载它没有为新加载的元素创建任何事件。因此,我在使用AJAX返回的页面中包含myjs.js
。
由于myjs.js
已经加载了页面,当返回包含myjs.js
的Ajax页面时,它会向已经加载页面的元素添加另一个事件。
我已经尝试了
$('*').unbind();
但这会产生一些奇怪的效果。
那么有关动态加载JQuery而不影响元素已存在的任何事件的想法吗?
答案 0 :(得分:2)
在没有看到jQuery代码的情况下,我怀疑用于绑定行为的选择器过于通用,因此您已经发现,每次都匹配所有现有元素和新加载的元素:
您可以在AJAX响应中返回的JavaScript中使用更具体的绑定,以便将行为仅添加到新加载的元素中。
但是,为每个AJAX请求返回相同的JavaScript效率很低,因为浏览器无法缓存。理想情况下,您应该尝试在主页上加载一次JavaScript,然后依靠jQuery自动为新加载的元素执行.live()
绑定。这也称为事件委派 - .delegate()
请注意,从jQuery 1.7开始,这些方法已被弃用,以支持更简洁的事件绑定基础结构 - .on()