Question

我正在使用Jquery当前版本2.1.x，并且根据jQuery API在新版本中不推荐使用 .live（）函数。建议使用＆＃39; on＆＃39;代替。我有一些用.live（）函数编写的javascript。我不明白如何用.on（）替换.live（）。

以下是我的代码：

的jQuery

$('#container .pagination li.active').live('click',function(){
    var page = $(this).attr('p');
    RelatedCatLink(eleme,page);
});

$('#go_btn').live('click',function(){
    var page = parseInt($('.goto').val());
    RelatedCatLink(eleme,page);

    var no_of_pages = parseInt($('.total').attr('a'));
    if (page != 0 && page <= no_of_pages) {

    } else {
        alert('Enter a PAGE between 1 and '+no_of_pages);
        $('.goto').val("").focus();
        return false;
    }
});

Answer 1

live背后的想法是能够将事件附加到尚未在DOM中的元素：

$('body').append($('<div id="new-el">))
$('#new-el').live('click', function { ... } );

在较新版本的jQuery中，现在建议将此类代码更改为：

$('body').append($('<div id="new-el">))
$('body').on('click', '#new-el', function { ... } );

这会将click事件附加到body标记，但如果在内部点击了的元素，该函数将只运行 body代码为#new-el。

在您的情况下 - 如果元素是即时创建的（在加载DOM之后），您可以将代码更改为：

$('body').on('click', '#container .pagination li.active' ,function(){ var page = $(this).attr('p'); RelatedCatLink(eleme,page); }); $('body').on('click', '#go_btn', function(){ var page = parseInt($('.goto').val()); RelatedCatLink(eleme,page); var no_of_pages = parseInt($('.total').attr('a')); if(page != 0 && page <= no_of_pages){ } else { alert('Enter a PAGE between 1 and '+no_of_pages); $('.goto').val("").focus(); return false; } });

Answer 2

尝试以下内容，将直播替换为

$('#container .pagination li.active').on('click',function(){
    var page = $(this).attr('p');
    RelatedCatLink(eleme,page);
});

$('#go_btn').on('click',function(){
    var page = parseInt($('.goto').val());
    RelatedCatLink(eleme,page);

    var no_of_pages = parseInt($('.total').attr('a'));
    if(page != 0 && page <= no_of_pages){

    }else{
        alert('Enter a PAGE between 1 and '+no_of_pages);
        $('.goto').val("").focus();
        return false;
    }

});

jQuery文档指向.on（）或.delegate（）函数来更新代码。 jQuery.on（）是一个更通用的事件处理函数，它是jQuery在内部用来映射jQuery公开的.click（），。change（）等高级事件函数的地方。

然而，使用jQuery.on（）并不是.live（）函数的一对一替换。虽然.on（）可以直接处理事件并使用与.live（）相同的语法，但您会发现是否只是将.live（）与.on（）一起切换为尚未存在的元素上的事件将会不开火。 IOW，.live（）的关键功能不起作用。

您可以使用.on（）来获得所需的效果，但是您必须更改语法以显式处理您对容器感兴趣的事件，然后提供过滤器选择器以指定您使用哪些元素实际上对于处理事件感兴趣。

Answer 3

您可以按照以下方式执行，

this.container.innerHTML="YOUR CONTENT";

如何用Jquery.on（）替换Jquery.live（）？

3 个答案: