Jquery live() vs 委托() [英] Jquery live() vs delegate()

问题描述

我在这里和网络上的其他地方阅读了一些关于 live() 和 delegate() 之间差异的帖子.但是我还没有找到我正在寻找的答案(如果这是一个骗局，请告诉我).

我知道live 和delegate 的区别在于live 不能在链中使用.我还在某处读到 delegate 在某些情况下更快(更好的性能).

我的问题是，是否存在应该使用 live 而不是 delegate 的情况?

更新

我已经设置了一个简单测试来查看性能差异.>

我还添加了新的 .on()，它在 jQuery 1.7+ 中可用

结果几乎总结了答案中所述的性能问题.

• 不要使用.live()，除非你的jQuery 版本不支持.delegate().
• 除非您的 jQuery 版本不支持 .on()，否则不要使用 .delegate().

.live() 和 .delegate() 之间的差异比 delegate() 和 之间的差异要大很多.on().

解决方案

我从不使用 live;我认为使用 delegate 的好处是如此巨大以至于难以抗拒.

live 的一个好处是它的语法与 bind 非常接近:

$('a.myClass').live('click', function() { ... });

但是，

delegate 使用了稍微冗长的语法:

$('#containerElement').delegate('a.myClass', 'click', function() { ... });

然而，在我看来，这对实际发生的事情更为明确.您没有从 live 示例中意识到事件实际上是在 document 上捕获的；使用 delegate，很明显事件捕获发生在 #containerElement 上.你可以用 live 做同样的事情，但语法变得越来越糟糕.

为要捕获的事件指定上下文还可以提高性能.对于 live 示例，对整个文档的每次单击都必须与选择器 a.myClass 进行比较以查看是否匹配.使用delegate，那只是#containerElement 中的元素.这显然会提高性能.

最后，live 要求您的浏览器查找 a.myClass 它当前是否存在.delegate 仅在触发事件时查找元素，从而进一步提高性能.

<小时>

NB delegate 在幕后使用 live，所以你可以用 live 做任何你可以用 delegate.我的回答涉及它们，因为它们是常用的.

还要注意，live 和 delegate 都不是现代 jQuery 中进行事件委托的最佳方式.新语法(从 jQuery 1.7 开始)使用 on 函数.语法如下:

$('#containerElement').on('click', 'a.myClass', function() { ... });

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).

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).

My question is, is there a situation where you should use live instead of delegate?

UPDATE

I've set up a simple test to see the difference in performance.

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.

• Don't use .live() unless your jQuery version doesn't support .delegate().
• Don't use .delegate() unless your jQuery version doesn't support .on().

The difference between .live() and .delegate() is A LOT bigger than between delegate() and .on().

解决方案

I never use live; I consider the benefits of using delegate to be so substantial as to be overwhelming.

The one benefit of live is that its syntax is very close to that of bind:

$('a.myClass').live('click', function() { ... });

delegate, however, uses a slightly more verbose syntax:

$('#containerElement').delegate('a.myClass', 'click', function() { ... });

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.

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.

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 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.

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屋！