事件分配VS .live（）

很久以前，我曾经使用此解决方案：事件分配VS .live（）

$('<div class="ok" />') 
.appendTo('body'); 

$('div.ok') 
.live('click',function(){ alert(); })

现在我用这一个：

$('<div class="ok" />') 
.appendTo('body') 
.click(function(){ alert(); })

是如何表现的差异？我相信第二种解决方案更好，因为它不需要live（）。它总是这样（还有很多元素）吗？为什么？

来源

2012-12-02 user1392191

你也知道'.live（）'已被弃用，对吧？ – Daedalus

是的，我知道。我们可以假设使用.on（） – user1392191

@ user1392191：如果提供的任何响应已将您的问号中的一个回答为接受。但是，如果您仍然遇到此问题，请告诉我们。 – Nope

是如何表现的差异？

那么，你什么时候使用live。 live总是与document绑定，并且防止事件冒泡起来也是不可能的，因为在事件已经冒泡完毕之后触发事件。

从这个意义上说，live()不是很友善。

您的第二个代码示例在创建时直接绑定到对象，与live()相比，使其执行更好，更灵活。您现在可以事件防止事件冒泡等等。

将创建时的事件直接绑定到元素上，与使用on()相比，指定要绑定的最接近的静态元素只有非常小的性能优势。

// Performs slightly better than on() but cannot be executed from anywhere unless the element is added at the same time. 
$('<div class="ok" />').appendTo('body').click(function(){ alert(); })

的好处是虽然比具有能够在例如一个常用方法是添加的元素之前绑定你的事件处理程序的益处小。

下面的内容与第二个代码示例相同，但可以在普通方法内很好地执行，并且不必是添加动态元素的一部分。

// Can be called in a common init method for example and still work. 
$(body).on('click', '.ok', function(){ alert();})

on()有，您可以从事件的结合分隔元素的添加大有裨益。

来源

2012-12-02 00:53:00 Nope

第二种方法提供的可能性微乎其微（假设您没有大量的div.ok元素掉入DOM），因为DOM不需要再次搜索。另一种选择是使用html/props签名：

$("<div>", { 
    'class': "ok", 
    'click': function() { 
     alert("You clicked the new element!"); 
    } 
}).appendTo("body");

演示：http://jsfiddle.net/w4Tj3/

记住.live()已被弃用。如果您要使用活动委派，最好从现在开始使用.on()。然而，就你而言，你并不一定需要。取而代之的是，以模仿.live()你建立一个监听器上document：

$(document).on("click", ".ok", function() { 
    alert("You clicked an .ok element!"); 
});

这种工作方式是通过利用事件冒泡行为。当你点击一个元素时，点击遍历DOM直到它最终到达document对象。然后jQuery检查发起点击的元素是否与我们的选择器（.ok）相匹配，并且它是否会运行匿名函数。

为了获得更好的性能，请不要绑定到document，而要绑定到更接近动态添加元素的位置。例如，如果您动态添加li元素，请绑定到其父项ol或ul。这样，事件在处理之前不需要传播太多。

有了事件委托，你可以从动态添加div本身删除click逻辑：

$("<div>", {'class': 'ok'}).appendTo("body");

来源

2012-12-02 00:52:38 Sampson

事件分配VS .live（）

回答

相关问题