由于live（）方法已在1.7版本中被弃用，我开始查看我的源代码并将所有的实时事件处理程序转换为on()。我以为这个更改很简单，一切都会像以前一样工作，但是我遇到了一些行为不正常的代码。
我有以下jQuery选择器来绑定table标签的click事件...
$('table.accordion-header').live("click", function ($e) {
// gobs of code
}
...并且它运行良好(例如-即使在页面上发生异步回发后，我的表格标签点击事件也会被触发)。但是如果我将代码更改为以下内容
$('table.accordion-header').on("click", function ($e) {
// gobs of code
}
在页面上发生任何异步后台回发后，点击事件将不再被触发。请注意 - 点击事件仅在异步后台回发之前起作用，但在此之后将不再起作用。那么我错过了什么？
这样的问题已经被回答过很多次了，因为似乎很常见人们不太理解动态版本的.on()如何工作。你正在使用静态形式的.on()，其中对象必须在调用.on()时存在，而你可能打算使用以下动态形式的.on()：
$(someStaticParentObject).on("click", 'table.accordion-header', function ($e) {
// code
}
.live()被替换为.on()，因为.on()允许您通过指定动态对象的静态父对象来附加事件处理程序，从而实现更好的性能，这比将其附加到document对象更有效率，这就是.live()的作用。我建议您阅读以下先前由我编写的答案，以了解如何最好地使用.on()。这些答案还包括有关如何最有效地使用.on()以及它是如何工作的简要描述的评论：
Does jQuery.on() work for elements that are added after the event handler is created?
How does jQuery's new on() method compare to the live() method in performance?
$('body').on 相对于 $(document).on 有什么优势？ - Paul Alexanderdocument是唯一的可能性，因为在加载DOM（页面加载）时没有其他对象存在。 - md1337等同于
$('table.accordion-header').live("click", function ($e) {
// gobs of code
} );
is
$(document).on("click", 'table.accordion-header', function ($e) {
// gobs of code
} );
.on()的工作原理以及应该如何使用它，那么有比使用$(document).on()更有效的使用方式。.live()被替换的一个主要原因是允许人们比这更有效地使用它。下面的答案提供了更多细节。 - jfriend00.delegate()可以更精细地控制... - Gabriele Petrioli我能说的最好的方式就像jQuery上的文档所说的那样，关于.live()和.on()功能：
//so this..
$('table.accordion-header').live("click", function ($e) {
// gobs of code
});
//becomes this..
$('table').on("click",'.accordion-header', function ($e) {
// gobs of code
});
在浪费了大量时间后，我发现我的页面上实际上有两个搜索表单，它们都使用相同的ID。
解决方案是给表单添加一个类名，这样我就可以集体地针对它们并使用.each()来逐个地定位它们。
我也试着将我的live()更新为on()，但一直遇到困难，后来有人向我展示了第一个父级或上下文选择器的工作原理，最终搞定了。关键是确保这个第一个元素在文档对象模型中。
$(this)与 .on() 的工作方式也不是很明显。
$(document).on("click", 'table.accordion-header', function ($e) {
// gobs of code
} );
live: function( types, data, fn ) {
jQuery( this.context ).on( types, this.selector, data, fn );
return this;
},
.live()等效的.on()的错误位置。 - jfriend00