Jquery .on与.live的区别

Question

我知道.live()已经被弃用了，但我似乎无法更改它并保持功能。

我对jQuery中的.on()函数有一个简单的问题。我当前在这里使用.live()：here 就像这样：

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

但是，当我尝试用 .on() 替换 .live() 时，它不再像它应该的那样工作。

我尝试放置

$('table tr th').on("click", function() {
});

以及

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

并且

$('table tr').delegate("th", "click", function() {
});

但是没有成功。

为什么会这样，我应该采取哪些步骤使其正常工作？

- ayyp

---

可能是重复的问题：jQuery 1.7 - 将 live() 转换为 on() - Felix Kling

@FelixKling 我试图避免使用$(document)来完全模拟调用。我在想是否有其他更符合 jQuery API 网站上示例的方法可以实现。 - ayyp

只需取最接近的现有元素（祖先）（这更符合.delegate的含义）。 - Felix Kling

Answer 1

on()函数需要进行语法更新，你应该修改你的代码为:

$('body').on("click", "table tr th", function()...

查看此文章以获取更多信息：http://www.andismith.com/blog/2011/11/on-and-off/

- Tom Walters

Answer 2

试试这个：

$('table tr th').live("click", function() {

应该是这样的。

$(document).on("click", "table tr th", function() {

那就是您如何完全模仿.live调用的方式。当然，您可以根据DOM结构将选择器限制在更有意义的东西上。 编辑：仅澄清，在您的示例中，您需要使用$(document).on(...)，因为表格没有任何父级并且在页面的生命周期内被替换。

- Kevin B

---

因为我要在代码中替换表格，所以需要使用 $(document)，这样调用才能持续工作吗？ - ayyp

@Andrew：不，层次结构中的任何现有元素都可以。 - Felix Kling

如果事件无法附加到元素本身，则必须将其附加到层次结构中始终存在的更高元素上，例如文档或主体。 - Tillito

Answer 3

确保在页面最初加载时所选元素（th/tr）存在。如果稍后将此选择器添加到DOM中，则新的.on将无法工作。

尝试：

$('body').on('click', 'thesSelectorForYourTriggerElement', function(){
    //callback
});

- Jay

Answer 4

我猜你是在表格中添加了 tr 元素，而不是 th。

$('table').on("click", "tr th", function(){});

- Ski

---

<th> 元素是从数组中生成并写入表格的第一个 <tr> 中。但是您的解决方案无效... - ayyp

那样行不通，他的表格是使用.replaceWith()替换的。 - Kevin B