jQuery.on不起作用，但.live起作用

由于live（）方法在1.7版时已被弃用，因此我开始检查我的源代码，并将所有live事件处理程序转换为on（）。我的印象是，改变会很简单，一切都会像以前一样顺利；但是，我遇到了一些行为不正常的代码

我使用以下jQuery select绑定表标记的单击事件

$('table.accordion-header').live("click", function ($e) {
  // gobs of code
}

。。。它工作得很好（即，即使在页面上发生异步回发之后，也会引发MyTable标记单击事件）。但是如果我把代码改成下面的

$('table.accordion-header').on("click", function ($e) {
  // gobs of code
}

然后，在页面上发生任何异步回发后，不再引发click事件。请注意-单击事件在任何异步回发之前都有效，但之后它不再有效。那么我在这里遗漏了什么呢？

相当于

$('table.accordion-header').live("click", function ($e) {
  // gobs of code
} );

是

---

像这样的问题已经被回答了很多次，因为人们不太了解

.on（）

的动态版本是如何工作的，这似乎很常见。您使用的是静态形式的

.on（）

，在调用

.on（）

时对象必须存在，而您可能打算使用动态形式的

.on（）

如下：

$(someStaticParentObject).on("click", 'table.accordion-header', function ($e) {
  // code
}

.live（）

被替换为

.on（）

，因为

.on（）

允许您通过指定要附加事件处理程序的动态对象的静态父对象来获得更好的性能，这比将其附加到

文档

对象更有效，而

.live（）

就是这样做的。我建议您阅读这些以前的答案（全部由我编写），以了解如何更好地使用

.on（）

。这些答案还包括有关使用

.on（）

的最有效方法的评论，以及对其工作原理的简要说明：

---

在jQuery 1.7.2源代码中，“live”几乎指向“on”，因此这个问题可能与“on”函数无关。这需要排除。上的选择器可能有问题

jQuery来源：

live: function( types, data, fn ) {
    jQuery( this.context ).on( types, this.selector, data, fn );
    return this;
},

---

我在尝试将live（）更新为on（）时也遇到了麻烦，但当有人向我展示第一个父级或上下文选择器如何工作时，我终于得到了它。关键是确保第一个元素位于文档对象模型中

$（this）使用.on（）的方式也不明显

$(document).on("click", 'table.accordion-header', function ($e) {
  // gobs of code
} );

在上面给出的示例中，函数代码中的$（this）将引用$（'table.accordion header'），而不是您所期望的$（document）

---

进一步解释如下：

我能表达这一点的最佳方式就像文档中所说的从on

.live（）

和

.on（）

功能：

在选择器“$（选择器）”中，插入一个随页面加载的具体元素，而不是动态加载

然后将辅助选择器放入指示“选择器”的方法中-可以动态创建此选择器

---

当然，假设“table”加载了页面。

检查是否将其放在“$（document）.ready（）”函数类型中，或者之前是否没有调用它并返回false。有一种检查方法：$（'table.accordion header'）.trigger（'click'）；但是，如果您真正了解

.on（）

的工作原理以及应该如何使用它，那么有比使用

$（document）.on（）

更有效的方法来使用它。替换

.live（）

的一个主要原因是允许人们更高效地使用它。我下面的回答提供了更多的细节。是的，的确。。我只是在研究OP提供的东西。。。对于更精细的控件，还有

.delegate（）

，如果您正在为正在单击的元素使用id，请添加到语法“#”$（文档）；如果您更仔细地查看此代码并阅读其他答案，您会发现问题在于他们将选择器

“table.accordion header”

放在了

.live（）

对应的

.on（）

的错误位置。我在这里要说的是，“live”和“on”是相同的，“live”指向“on”。这是一个选择问题，既不是直播也不是直播。为什么在最初的问题中，海报假设将直播改为直播是一个问题，而你却必须将我的答案标记为无用。我必须指出on==live，这是一个排除他对这两个人最初误解的建议。在我看来，你没有回答他们的问题。你提供了一个地方去看的想法，甚至连OP应该看的东西都很模糊。您说过“on的选择器可能有问题”。他们需要更换选择器吗？他们应该如何修复它？这充其量只是一个评论，因为这不是一个答案。你，你自己，甚至不确定这是一个正确的方向，基于你的写作基调，你没有告诉他们如何修复它。对不起，丹尼斯。我认为我们不需要把这变成一种意见分歧。不是问题真正答案的评论（甚至是非常有用的评论）应该作为评论而不是答案发布。这就是SO所希望的，也是他们认为问答形式最有效的方式。如果您更具体地说明他们应该如何将选择器放置在不同的位置（如Gaby的答案），我会认为这是一个有效的答案。您提到附加到静态元素比附加到文档要好。但是，如果您不知道特定的家长使用

$（'body'）有什么好处。在
和
$（document）。在
？@PaulAlexander-首先，您应该将
$（document.body）
与
$（document）
进行比较。我总是尽可能选择DOM层次结构中最低的一个（本例中为document.body），但实际上这两个层次之间可能没有太大区别。@jfriend00，在许多情况下，附加到
document
I
$(document).on("click", 'table.accordion-header', function ($e) {
  // gobs of code
} );

//so this..
    $('table.accordion-header').live("click", function ($e) {
  // gobs of code
});

//becomes this..   
    $('table').on("click",'.accordion-header', function ($e) {
  // gobs of code
});