jQuery live()vs委托() [英] Jquery live() vs delegate()
问题描述
我在这里和网上的其他地方都读过一些有关live()
和delegate()
之间差异的文章.但是我没有找到我想要的答案(如果这是一个骗子,请告诉我).
I've read some posts here and elsewhere on the web about the differences between live()
and delegate()
. However I haven't found the answer I'm looking for (if this is a dupe please tell me).
我知道live
和delegate
之间的区别是live
不能在链中使用.在某些情况下,我还读到delegate
更快(性能更好).
I know that the difference between live
and delegate
is that live
cannot be used in a chain. I also read somewhere that delegate
is in some cases faster (better performance).
我的问题是,是否应该使用live
而不是delegate
?
My question is, is there a situation where you should use live
instead of delegate
?
更新
我已经设置了简单测试,以查看性能差异.
I've set up a simple test to see the difference in performance.
我还添加了新的.on()
,它在jQuery 1.7+中可用
I've also added the new .on()
which is available in jQuery 1.7+
结果几乎总结了答案中提到的性能问题.
The results pretty much sum up the performance issues as stated in the answers.
- 请勿使用
.live()
,除非您的jQuery版本不支持.delegate()
. - 除非您的jQuery版本不支持
.on()
,否则请不要使用.delegate()
.
- Don't use
.live()
unless your jQuery version doesn't support.delegate()
. - Don't use
.delegate()
unless your jQuery version doesn't support.on()
.
.live()
和.delegate()
之间的差异比delegate()
和.on()
之间的差异大很多.
The difference between .live()
and .delegate()
is A LOT bigger than between delegate()
and .on()
.
推荐答案
我从不使用live
;我认为使用delegate
的好处是如此之大,以至于让人不知所措.
I never use live
; I consider the benefits of using delegate
to be so substantial as to be overwhelming.
live
的一个好处是它的语法与bind
的语法非常接近:
The one benefit of live
is that its syntax is very close to that of bind
:
$('a.myClass').live('click', function() { ... });
delegate
,但是,使用了稍微冗长的语法:
delegate
, however, uses a slightly more verbose syntax:
$('#containerElement').delegate('a.myClass', 'click', function() { ... });
但是,在我看来,这似乎更清楚地说明了实际发生的事情.从live
示例中,您没有意识到实际上是在document
上捕获了事件;对于delegate
,很明显,事件捕获发生在#containerElement
上.您可以使用live
做同样的事情,但是语法变得越来越糟糕.
This, however, seems to me to be much more explicit about what is actually happening. You don't realise from the live
example that the events are actually being captured on document
; with delegate
, it is clear that the event capturing happens on #containerElement
. You can do the same thing with live
, but the syntax becomes increasingly horrid.
为要捕获的事件指定上下文也可以提高性能.对于live
示例,必须将整个文档上的每次单击与选择器a.myClass
进行比较,以查看其是否匹配.对于delegate
,仅是#containerElement
中的元素.这显然会提高性能.
Specifying a context for your events to be captured also improves performance. With the live
example, every single click on the entire document has to be compared with the selector a.myClass
to see if it matches. With delegate
, that is only the elements within #containerElement
. This will obviously improve performance.
最后,live
要求您的浏览器查找a.myClass
当前是否存在. delegate
仅在事件触发时才查找元素,从而进一步提高了性能.
Finally, live
requires that your browser looks for a.myClass
whether or not it currently exists. delegate
only looks for the elements when the events are triggered, giving a further performance advantage.
NB delegate
在后台使用live
,因此您可以使用live
进行任何操作,而您可以使用delegate
进行任何操作.我的回答是针对它们的,因为它们是常用的.
NB delegate
uses live
behind the scenes, so you can do anything with live
that you can do with delegate
. My answer deals with them as they are commonly used.
还请注意,live
和delegate
都不是在现代jQuery中进行事件委托的最佳方法.新语法(自jQuery 1.7起)使用 on
函数.语法如下:
Note also that neither live
nor delegate
is the best way to do event delegation in modern jQuery. The new syntax (as of jQuery 1.7) is with the on
function. The syntax is as follows:
$('#containerElement').on('click', 'a.myClass', function() { ... });
这篇关于jQuery live()vs委托()的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!