如何使用ON而不是LIVE

How to use ON instead of LIVE

本文关键字：LIVE 何使用 ON      更新时间：2023-09-26

可能的重复项：
jQuery 1.7 - 将 live（） 转换为 on（）

我有jQuery：

          $(".house td[red]").live("click", function() {
              alert('ok');
          });

但是函数实时已被弃用。如何使用？

          $(".house td[red]").on("click", function() {
              alert('ok');
          });

不工作。

 $(".house").on("click", 'td[red]', function() {
              alert('ok');
          });

你试过这个吗？您可以查看文档以了解详细信息。那里的例子：

$("#dataTable tbody").on("click", "tr", function(event){
    alert($(this).text());
});

所以你基本上为包装器传递了一个"容器"。不推荐 live 的原因是它可以像这样用"on"语法编写：

$(document).on("click", '.house td[red]', function() {
              alert('ok');
          });

你可以看到效率不是很高。可能还有更多:)所以你想改变它是件好事。

将其用作 - 

$(document).on("click", ".house td[red]", function() {
  alert('ok');
});

更有效的方法是将.on()与元素的直接父级一起使用 - 

$('.house').on("click", "td[red]", function() {
      alert('ok');
});

阅读此处以更好地了解live和on之间的差异

on()是一个万物对全人的函数，可以以不同的方式工作 - 无论是直接事件还是委托事件。 live()是实现委派事件的一种手段。这是通过on()通过将过滤器作为参数 2 传递，并将回调提升到参数 3 来实现的：

$(".house").on("click",  'td[red]', function() {
    alert('ok');
});
这是一个

三参数的变体，你可以选择"气泡"点：

$('body').on('click', '.house td[red]', function() { alert("ok"); });

不同之处在于，放置实际事件处理程序的点在您的控制之下（就像同样弃用的.delegate()一样）。您可以选择任何您喜欢的父元素，这在复杂页面中是一个很好的功能。（例如，在您的情况下，您可以将处理程序放在所有".house"元素而不是正文上。

$(document).on('click', '.house td[red]', function(){
    alert('ok');
});

文档是我们希望将处理程序附加到的静态元素。

第一个参数是事件

第二个参数是选择器

第三个参数是您希望在触发事件时针对选择器运行的函数。

试试这个，

$(document).on("click", ".house td[red]", function() {
     alert('ok');
});

$(".house td[red]").live("click", function() {
    alert('ok');
});

将直接转换为：

$(document).on("click", ".house td[red]", function() {
    alert('ok');
});

但是，您可以通过指定绑定时已知将存在的最接近的容器来获得一些性能：

$('#someContainer').on("click", ".house td[red]", function() {
    alert('ok');
});

$(document).on("click",".house td[red]",function(){
     alert('ok');
});
相关文章：