Question

目前我正在使用John Resig's LiveQuery plugin/function来允许用户对列表项的长无序列表进行排序。代码如下：$('input#q').liveUpdate('ul#teams').focus();当我使用ajaxified选项卡对列表进行排序时，会出现问题。基本上我使用ajax来引入不同的列表，而liveUpdate()函数无法访问新的li。

我认为我需要使用.live() function绑定它。但我不清楚如何将其绑定到ajax事件，我只使用了“click”事件。如何将新liveUpdate()绑定到新加载的列表项？

修改 ajax选项卡通过wordpress ajax api运行，所以代码相当复杂，但简化它是这样的：

$('div.item-list-tabs').click( function(event) {
    var target = $(event.target).parent();

    var data = {action, scope, pagination}; // Passes action to WP that loads my tab data
    $.post( ajaxurl, data, function(response) {
        $(target).fadeOut( 100, function() {
            $(this).html(response);
            $(this).fadeIn(100);
        });
     });

     return false;
});

为了进行此对话，这是简化的，但基本上$.post加载到位的响应.liveUpdate()无法访问它。我相信.live()函数是这个问题的答案，我不清楚如何使用$.post()

来实现它

Answer 1

正如JQuery文档中提到的，.live（）被认为已弃用。您应该使用方法.on（）代替。

$("#yourSelector").on("click", function() {
    // statement
});

要管理选择器类型的futur对象，您可以像这样使用.on（）

$(document).on("click", "#yourSelector", function() {
    // statement
});

Answer 2

尝试使用jQuery's Ajax Events

$('input#q').ajaxComplete(function(){
    $(this).liveUpdate('ul#teams').focus();

    $(this).unbind('ajaxStop');
});

Answer 3

我也只是使用

而遇到了麻烦

$('selector').click(function(..

在Ajax调用之后，终于发现我们需要使用

$('selector').live("click", function(){..

或新方法

$(document).on('click', 'selector', function(){..

为Ajax调用后创建的新元素绑定事件。

$(document).on('click','selector', function(event){
//your code    
});

直播

$('selector').live('click', function(event){    
//your code    
});

Answer 4

$('input#q').live(function() {
   $(this).liveUpdate('ul#teams').focus();
});

Answer 5

$("div.item-list-tabs").live("click",function(){
//statements..
});

如何将jQuery .live（）与ajax一起使用

5 个答案: