Question

当我使用jQuery将事件附加到元素时，我通常会这样做：

$(document).ready(function() {
    $('#some_id').click(function() {
        // Do some stuff
    });
});

但是，我已经看到了许多这样做的例子：

$('#some_id').live('click', function() {
    // Do some stuff
});

（几乎总是没有ready包装。）

如果元素已经在页面中并且不在任何地方，那么这种方式是否存在缺陷？

Answer 1

.live()存在许多弊端，因此我会限制其使用时间：

需要将大量元素绑定到同一个事件处理程序或
元素。

.live()通过将事件处理程序附加到document并检查event.target是否与给定的选择器匹配来工作。这导致：

在点击 <{strong> #some_id以外的元素时对选择器进行不必要的检查。

没有机会stopPropagation()事件，因为它已经到达根目录（尽管你仍然可以preventDefault()）。

同样，点击#some_id或.click()将.bind() return false或stopPropagation() .live() 父母附加的处理程序通过.triggerHandler()附加的沉默处理程序，因为事件将不再到达根目录。

只能与选择器（字符串）一起使用。

可能会导致意外事件处理顺序，因为事件将按照绑定的顺序触发，而不是以冒泡顺序（子节点到父节点）触发。

如果删除该元素，则不会删除该事件。

虽然很少见，但你不能{{1}}元素。

Answer 2

缺点是事件处理“慢”。 live()将单击处理程序附加到文档根目录，并使用event bubbling从指定元素中捕获事件。

因此，事件不是由它所引发的元素直接处理，而是必须冒出整个DOM树。

Answer 3

当您要附加事件的DOM元素可以被修改/替换时，您将使用.live。它会有额外的开销，因为它会监听DOM修改。因此，只有当您知道将修改DOM元素以避免重新附加它们时才使用它。例如，如果您使用AJAX将部分页面替换为某些新内容，并且此部分包含您要附加事件的DOM元素，则需要使用.live。否则使用标准.click。

Answer 4

如果有动态添加的元素，则只需.live()。如果DOM是静态的，那么.click()就可以了。

有关使用官方文档中的.live()的一些注意事项：

不支持DOM遍历方法来查找要发送到.live()的元素。相反，应始终在选择器之后直接调用.live（）方法，如上例所示。
要在使用.live()进行绑定后停止执行其他处理程序，处理程序必须返回false。调用.stopPropagation()无法实现此目的。
在jQuery 1.3.x中，只有以下JavaScript事件（除自定义事件外）才能与.live()绑定：click，dblclick，keydown，{{ 1}}，keypress，keyup，mousedown，mousemove，mouseout和mouseover。

Answer 5

.live的工作方式类似于*live*节点列表，这意味着在调用之后添加的节点（匹配css选择器）也将添加到处理程序中。

第一个调用仅在处理时将处理程序添加到与css选择器匹配的节点。

在您的示例中，您的css选择器为#some_id。如果您稍后添加了几个具有完全相同ID的节点（即some_id），那么这些节点将添加处理程序.live()，但不会添加第一次调用。

Answer 6

使用.live()方法的原因可以是动态添加，创建或加载的DOM元素。例如，你动态地，通过AJAX调用，加载一个表单，你想绑定到这个表单的“提交”事件一些回调函数。您可以在加载表单的过程完成后手动执行此操作，或者您只需使用.live()方法一次，并且每次加载时都忘记处理此表单。

P.S。 .live()和sumbit存在问题，但我希望它们已修复。

Answer 7

你可以使用.delegate http://api.jquery.com/delegate/

我应该使用.live（...）吗？

7 个答案: