始终使用' live'的jQuery缺点. [英] jQuery disadvantages of consistently using 'live'

问题描述

在我的整个应用程序中始终使用jQuery的实时"功能有什么缺点吗?

Are there any disadvantages of using jQuery's 'live' consistently throughout my application?

如果我将点击处理程序附加到我想要的所有元素上，然后决定使我的应用程序AJAX成为现实，那么我就必须仔细检查并在jQuery中添加大量实时"处理程序.

If i attach click handlers to all my elements that i want and then decide to make my application AJAX, i'd have to go through and add a load of 'live' handlers in my jQuery.

我在谈论性能和HTTP请求等...缺点是什么?

I'm talking performance and HTTP requests etc...what are the disadvantages?

推荐答案

请勿使用live.当他们介绍jQuery时，这是一个错误.仅使用delegate.

You should never use live. It was a mistake on jQuery's part when they introduced it. Only use delegate.

使用live时，jQuery将不得不听每单单击该文档.在大多数情况下，这是矫kill过正.想象一下:

When using live, jQuery will have to listen to every single click on the document. In most cases, this is overkill. Imagine this:

<table id="products">
    <tr>
        <td></td>
        <td></td>
    </tr>
    <tr>
        <td></td>
        <td></td>
    </tr>
</table>

现在，您想在所有这些行上绑定一个click事件处理程序.如果采用live方式，则将执行以下操作:

Now, you want to bind a click event handler on all of those rows. If you go the live way, you'll do this:

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

这里发生的事情是，每当单击整个页面上的任何元素时，jQuery都必须通过选择器运行它(在本例中为tr)看看是否匹配.这没有任何理由就浪费了很多资源.您可以通过以下方式完成同一件事:

What's happening here is that whenever any element on the whole entire page is clicked, jQuery will have to run it through your selector (in this case tr) to see if it matches. That is wasting a lot of resources for no good reason. You can accomplish the same thing by:

$('#products').delegate('tr', 'click', function(){...});

这将导致jQuery仅侦听表内的click事件(尽管它仍将运行选择器检查每种类型的元素被点击).

which will cause jQuery to only listen on click events inside that table (although it'll still run that selector check on every type of element clicked).

现在，有时候您确实确实需要侦听整个页面上的点击.但是，即使您确实需要它，使用$(document).delegate('a', 'click', function(){...});还是更好.

Now, sometimes you really do need to listen for clicks on the entire page. But, even if you do need that, you're still better off using $(document).delegate('a', 'click', function(){...});.

想象一下以下情况:

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

您在这里所做的是遍历所有a标记的DOM，但是您对该集合不做任何事情.您只是在做自己可以完成的事情:

What you're doing here is traversing the DOM for all the a tags, but you're not doing anything with that collection. You're merely doing what you could've accomplished with:

$(document).delegate('a', 'click', function(){...});

但无需先遍历DOM！

进一步阅读:

http://api.jquery.com/live/#caveats
http://www.alfajango.com/Blog/the-difference-between-jquerys-bind-live-and-delegate/

更新:随着jQuery 1.7的出现，新的.on方法是引入:

Update: With the advent of jQuery 1.7, the new .on method was introduced:

.on()方法将事件处理程序附加到jQuery对象中当前选定的元素集.从jQuery 1.7开始，.on()方法提供了附加事件处理程序所需的所有功能.

The .on() method attaches event handlers to the currently selected set of elements in the jQuery object. As of jQuery 1.7, the .on() method provides all functionality required for attaching event handlers.

因此，在上面的示例中，您将使用以下代码:

So, in our examples above, you'd use this:

$('#products').on('click', 'tr',  function(){...});

还有这个

$(document).on('click', 'a', function(){...});

分别.

尽管旧方法仍然可以使用，但是现在这是首选方法.

Although the old methods would still be functional, this is now the preferred way.

这篇关于始终使用' live'的jQuery缺点.的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！