jQuery:如何用.on替换.live?

Car*_*us_ 49 jquery

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

根据jQuery API(http://api.jquery.com/on/),不推荐使用'live'函数,建议使用'on'代替.但是当我在代码中用'on'替换'live'时,jQuery再也找不到添加的元素了:

这有效(但已弃用):

$('li.bibeintrag').live('click', function(){
alert('myattribute =' + $(this).attr('myattribute'));
});
Run Code Online (Sandbox Code Playgroud)

这是来自'on'的API的示例:

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

当我将我的代码更改为此('live'替换为'on')时它不再起作用(jQuery将找不到以后添加的元素(例如with append)):

$('li.bibeintrag').on('click', function(){
alert('myattribute =' + $(this).attr('myattribute'));
});
Run Code Online (Sandbox Code Playgroud)

我究竟做错了什么?有人可以帮帮忙吗?

Vis*_*ioN 65

您应该将事件添加到任何父元素li.bibeintrag.

$('ul').on('click', "li.bibeintrag", function(){
    alert('myattribute =' + $(this).attr('myattribute'));
});
Run Code Online (Sandbox Code Playgroud)

  • 如果我理解正确,这在技术上并不是一个确切的替代品,因为使用这种方法,动态添加的`<ul>`元素中的项目将不会获得'click'处理程序.要完全复制`live()`使用`on()`,你必须选择`document`(或者也许是`body`). (12认同)

Sam*_*son 33

jQuery的直播,通过$.on样式查看时看起来像这样:

$(document).on("click", "li.bibeintrag", function(){

});
Run Code Online (Sandbox Code Playgroud)

它将在该document级别侦听单击事件,并确定其目标是否与第二个参数匹配$.on.我们鼓励你和我自己这样做,但是我们不想在文档级别上听,而是希望更接近元素本身(因此事件在处理之前不需要传播太远).

由于您正在响应点击次数li,因此请监听该项级别的父级:

$("ul#myList").on("click", "li.bibeintrag", function(){
  /* Respond */
});
Run Code Online (Sandbox Code Playgroud)

请记住,如果不提供第二个参数$.on,事件处理程序将绑定到元素本身,这意味着您不会获得$.live对动态添加元素作出反应的行为.

  • 这应该是公认的答案,因为它涵盖了这种情况以及一般情况. (2认同)