如何使用ON而不是LIVE

Question

  

可能重复：
  jQuery 1.7 - Turning live() into on()

我有jQuery：

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

但不推荐使用直播功能。我该如何使用？

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

不能正常工作。

Answer 1

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

你试过这个吗？您可以查看in documentation了解详细信息。例子来自：

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

所以你基本上为包装器传递一个“容器”。不建议使用live的原因是它可以使用“on”语法编写，如下所示：

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

你可以看到

效率不高。可能还有更多:)所以你想改变它是好的。

Answer 2

将其用作 -

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

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

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

阅读here，以便更好地了解live和on

之间的差异

Answer 3

on()是一个全能的人，可以以不同的方式工作 - 包括直接事件和委托事件。 live()是实现委派活动的一种手段。通过将过滤器作为参数2传递，并将回调碰到参数3来实现on()：

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

Answer 4

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

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

第一个参数是事件

第二个参数是选择器

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

Answer 5

这是一个三参数变体，你可以选择“泡沫”点：

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

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

Answer 6

试试这个，

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

Answer 7

$(".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');
});

Answer 8

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