将所有jquery脚本转换为实时脚本

时间:2013-11-17 16:18:18

标签: javascript jquery load live

我有很多jquery脚本,它们不处理动态加载或创建的元素,当然我可以转换所有的scrits并将它们添加到.live()函数中。但是想知道是否有任何选项或技巧可以自动模拟所有脚本中的实时功能而无需手动逐个修改它们。

感谢您的评论,live是折旧的,所以我用.on()函数重述我的问题。

1 个答案:

答案 0 :(得分:2)

没有一个技巧可以使所有现有的事件处理程序代码与动态加载的元素一起使用而不更新每个事件处理程序,除非您想要使用与jQuery记录的工作方式不同的方法替换某些jQuery方法(不推荐)。您必须使用强制委托事件处理的方法替换当前使用的所有jQuery事件处理方法。这将是一个糟糕的方式来做到这一点。你不仅会将jQuery破解成与文档不同的东西,而且会让自己陷入与其他代码的兼容性问题,但是你会被迫使用委托事件处理的最低效使用(这就是为什么{{1首先删除了)。不要这样做。修复代码以使用适当的委托事件处理方法。这根本不难。


.live()已被弃用,甚至已从最新版本的jQuery中删除。你不应该使用它。有一种.live()形式允许您对动态加载的对象使用委托事件处理。您可以在此帖子中看到如何使用适当形式的.on()来动态加载元素:jQuery .live() vs .on() method for adding a click event after loading dynamic html

.on()用于动态元素的“正确”方法如下:

.on()

在这里选择动态元素最接近的父级,它不是动态加载的,并将事件处理程序绑定到该元素。


$('#parent').on("click", "#child", function() {}); 已被删除,因为它将.live()对象上的所有委派事件处理程序与此类似:

document

但是,如果您使用了许多这样的委托事件处理程序,性能可能会开始陷入困境。这是因为当你以这种方式执行它并且单击文档中的任何位置并且单击冒泡到文档时,它必须比较您对当前单击对象的每个$(document).on("click", "#child", function() {}); 事件处理程序中的每个选择器。由于选择器比较并不总是很快,这可能会使事件的处理陷入困境。

当你将事件处理程序放在一个更接近实际对象的对象上时,你最终会得到远处的事件处理程序,因此要比较的选择器和处理事件的速度要快得多。


以下是静态事件处理程序和委托事件处理程序之间的一些差异的参考资料以及对它们的一些有用说明:JQuery Event Handlers - What's the "Best" method