如何使用ON而不是LIVE [复制]

时间:2022-08-05 02:20:06

Possible Duplicate:
jQuery 1.7 - Turning live() into on()

可能重复:jQuery 1.7 - 将live()转换为on()

I have with jQuery:

我有jQuery:

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

but function live is deprecated. How can i use on?

但是现场的功能已被弃用。我怎么用?

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

not working.

不工作

8 个解决方案

#1


1  

It's a three-argument variant, and you get to pick the "bubble" point:

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

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

The difference is that with this, the point at which the actual event handler is placed is under your control (like with the also-deprecated .delegate()). You can pick any parent element you like, which is a nice feature in complicated pages. (In your case, for example, you could put the handler on all the ".house" elements instead of the body.)

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

#2


4  

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

have you tried this? You can check in documentation for details. Example from there:

你试过这个吗?您可以在文档中查看详细信息。那里的例子:

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

So you basically pass a "container" for wrapper. The reason why live is not recommended is that it can be written with "on" syntax like this:

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

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

which you can see is not very efficient. Probably there's more to that :) so it is good you want to change it.

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

#3


3  

Use it as -

用它作为 -

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

The more efficient way is using .on() with immediate parent of the element -

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

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

Read here for better understanding of difference between live and on

请阅读此处以更好地了解live和on之间的区别

#4


2  

on() is an all-things-to-all-men function that can work in different ways - both with direct and delegated events. live() was a means of achieving delegated events. This is achieved with on() by passing a filter as param 2, and bumping the callback to param 3:

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

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

#5


1  

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

Document is the static element we wish to attach our handler to.

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

First param is the event

第一个参数是事件

Second param is the selector

第二个参数是选择器

Third param is the functions you wish to run against the selector when the event is fired.

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

#6


1  

Try this,

尝试这个,

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

#7


1  

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

Would be directly converted to this:

将直接转换为:

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

But you can gain some performance by specifying the closest container that you know will exist at the time of the bind:

但是,您可以通过指定绑定时存在的最接近的容器来获得一些性能:

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

#8


0  

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

#1


1  

It's a three-argument variant, and you get to pick the "bubble" point:

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

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

The difference is that with this, the point at which the actual event handler is placed is under your control (like with the also-deprecated .delegate()). You can pick any parent element you like, which is a nice feature in complicated pages. (In your case, for example, you could put the handler on all the ".house" elements instead of the body.)

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

#2


4  

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

have you tried this? You can check in documentation for details. Example from there:

你试过这个吗?您可以在文档中查看详细信息。那里的例子:

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

So you basically pass a "container" for wrapper. The reason why live is not recommended is that it can be written with "on" syntax like this:

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

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

which you can see is not very efficient. Probably there's more to that :) so it is good you want to change it.

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

#3


3  

Use it as -

用它作为 -

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

The more efficient way is using .on() with immediate parent of the element -

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

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

Read here for better understanding of difference between live and on

请阅读此处以更好地了解live和on之间的区别

#4


2  

on() is an all-things-to-all-men function that can work in different ways - both with direct and delegated events. live() was a means of achieving delegated events. This is achieved with on() by passing a filter as param 2, and bumping the callback to param 3:

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

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

#5


1  

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

Document is the static element we wish to attach our handler to.

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

First param is the event

第一个参数是事件

Second param is the selector

第二个参数是选择器

Third param is the functions you wish to run against the selector when the event is fired.

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

#6


1  

Try this,

尝试这个,

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

#7


1  

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

Would be directly converted to this:

将直接转换为:

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

But you can gain some performance by specifying the closest container that you know will exist at the time of the bind:

但是,您可以通过指定绑定时存在的最接近的容器来获得一些性能:

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

#8


0  

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