jQuery.live 和 jQuery.delegate 之间的区别

发布于 2024-10-31 05:51:51 字数 264 浏览 0 评论 0原文

我读过一些关于为什么不使用 jQuery.live() 的文章，我想检查一下我是否明白了:) 当我调用 $("body").delegate('element','click', function);

是否与 $(element).live('click', function 相同）？在正常行为的情况下..根据帖子，有一些 stopPropagation 和性能增益，但主要区别是每次实时绑定到 body 元素，而委托可以绑定到另一个元素吗？

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

<逆流佳人身旁 2024-11-07 05:51:51

一个重要的区别是，“.live()”实际上会为初始选择器构建 jQuery 元素列表，即使“.live()”函数本身只需要选择器字符串。这意味着如果选择器有点昂贵，那么设置处理程序的代码将无缘无故地在整个 DOM 上运行。 “.delegate()”调用不这样做。

真的，我看不出新代码应该使用“.live()”的任何理由；这是一种建筑错误，最终应该悄然消亡。

回复收藏 0 原文

剩一世无双 2024-11-07 05:51:51

Nettuts 有一个截屏视频只是为了解释这一点：快速提示：Live() 和 Delegate() 之间的区别

引用自网站:

// Live(), introduced in 1.3, allows for the binding  
// of event handlers to all elements that match a  
// selector, including those created in the future.  
// It does this by attaching the handler to the document.  
// Unfortunately, it does not work well with chaining.  
// Don't expect to chain live() after calls like  
// children().next()...etc.  
$("li").live("click", function() {  
    $(this).parent().append("<li>New Element</li>");  
});   

// Delegate, new to version 1.4, perhaps should have been a complete  
// replacement for Live(). However, that obviously  
// would have broken a lot of code! Nonetheless,  
// delegate remedies many of the short-comings  
// found in live(). It attaches the event handler  
// directly to the context, rather than the document.  
// It also doesn't suffer from the chaining issues  
// that live does. There are many performance benefits  
// to using this method over live().  
$('#items').delegate('li', 'click', function() {  
    $(this).parent().append('<li>New Element</li>');  
});

Nettuts has a screencast just to explain this: Quick Tip: The Difference Between Live() and Delegate()

Quote from the site:

// Live(), introduced in 1.3, allows for the binding  
// of event handlers to all elements that match a  
// selector, including those created in the future.  
// It does this by attaching the handler to the document.  
// Unfortunately, it does not work well with chaining.  
// Don't expect to chain live() after calls like  
// children().next()...etc.  
$("li").live("click", function() {  
    $(this).parent().append("<li>New Element</li>");  
});   

// Delegate, new to version 1.4, perhaps should have been a complete  
// replacement for Live(). However, that obviously  
// would have broken a lot of code! Nonetheless,  
// delegate remedies many of the short-comings  
// found in live(). It attaches the event handler  
// directly to the context, rather than the document.  
// It also doesn't suffer from the chaining issues  
// that live does. There are many performance benefits  
// to using this method over live().  
$('#items').delegate('li', 'click', function() {  
    $(this).parent().append('<li>New Element</li>');  
});

回复收藏 0 原文

仅一夜美梦 2024-11-07 05:51:51

主要区别是每次都实时绑定到 body 元素，而委托可以绑定到另一个元素？

是的，完全正确。假设您有一个表，您可以在其中添加和删除行，并且您想要处理对这些行（或行中的链接或按钮）的点击。您可以使用live来实现这一点，但是事件必须一直冒泡到主体级别，让我们面对现实吧，它感觉有点像全局变量。如果您在 table 元素上使用 delegate，您将保持更有针对性，与页面上发生的其他事情隔离。 delegate 是 live 的更加模块化、包含的版本。

回复收藏 0 原文

小红帽 2024-11-07 05:51:51

由于 .live() 方法在事件传播到文档顶部后对其进行处理，因此无法停止实时事件的传播。类似地，由 .delegate() 处理的事件将始终传播到它们被委托的元素；当调用委托的事件处理程序时，其下面的任何元素上的事件处理程序都已经执行。

回复收藏 0 原文

时光是把杀猪刀 2024-11-07 05:51:51

其缺点是 .live 在文档级别运行，而 .delegate 在您指定的任何元素上运行。为什么它会有所不同？如果您使用 .live 绑定了一个（或多个）mousemove 事件，每次您将鼠标移动到页面上的任何位置时，jQuery 都会执行代码，以查看您的回调函数是否应该运行。这是极其低效的，也是使用 .delegate 的原因。 .delegate 函数仅在偶数源自您指定的 dom 节点内部时运行。例如，如果您说 $('ul#myUL').delegate(...)，那么 jQuery 只会检查当事件源自 时代码是否应该运行>ul#myUL