JQuery'on'与'live'

Question

我有一个场景，JQuery'on'＆amp; 'live'不会执行相同的操作。也许有人可以指出原因。我在我的项目中使用JQuery 1.7.2，在这个版本中，'live'已被'on'取代。我在列表页面中使用以下代码。基本上，此页面有一个字母栏，用户可以点击＆amp;将加载具有该姓氏的所有客户端。我想通过ajax执行链接。

代码：

$("a.listajax").on("click", function (e) {
    e.preventDefault();
    var url = $(this).attr("href");
    $("div.content").load(url + " div.content");
    return false;
});

这里的问题是，当我第一次加载页面并点击链接时，一切正常。页面通过ajax加载。然而，在此之后，所有链接都失去了它们的绑定。然后，如果我点击任何链接，我会加载整个页面。

我将'on'替换为'live'，并且链接开始表现完美，即使在后续点击中也是如此。

我错过了什么？

Answer 1

不能简单地将.live替换为.on。

$("a.listajax").live('click', function(e))

相当于：

$(document).on('click', 'a.listajax', function(e))

重要

如果您的所有.listajax锚点的共同祖先不会从DOM中移除，您应该使用它（最深的一个）而不是document;这将提高绩效。

Answer 2

这就是live()的重点。它在创建时重新绑定新的DOM元素。在jQuery的网站上有很多类似的问题，比如this one，因为它可能有点令人困惑。

根据jQuery docs，您使用live()来：

  

为与当前匹配的所有元素附加事件处理程序   选择器，现在和将来。

“...将来”部分是关键，因为on() does not have that。