Comment utiliser jQuery .live() avec ajax

Question

Actuellement, j'utilise John Resig's LiveQuery plugin/function pour permettre aux utilisateurs de trier une longue liste non ordonnée d'éléments de liste. Le code est le suivant: $('input#q').liveUpdate('ul#teams').focus(); Le problème se pose lorsque j'utilise des onglets ajaxifiés pour trier les listes. Essentiellement j'utilise ajax pour tirer dans différentes listes et la fonction liveUpdate() n'a pas accès au nouveau li.

Je suppose que je devrais lier cela en utilisant le .live() function. Mais je ne sais pas comment lier cela à un événement ajax, j'ai seulement utilisé l'événement "click". Comment lier le nouveau liveUpdate() aux éléments de liste nouvellement chargés?

EDIT: Les onglets ajax est géré par l'api ajax wordpress le code est donc assez complexe, mais simplifié, il est quelque chose comme ceci:

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

Ceci est simplifié pour le bien de cette conversation , mais fondamentalement une fois le $.post charge la réponse en place .liveUpdate() n'a pas accès à elle. Je crois que la fonction .live() est la réponse à ce problème, je ne suis pas clair sur la façon de le mettre en œuvre avec le $.post()

Answer 1

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

Answer 2

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

Answer 3

Essayez d'utiliser jQuery's Ajax Events

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

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

Answer 4

Comme mentionné dans la documentation de JQuery, .live() est considéré comme obsolète. Vous devriez utiliser la méthode .on() à la place.

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

Pour gérer également l'objet futur du type de sélection, vous pouvez utiliser .on() comme celui-ci

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

Answer 5

J'ai aussi eu du mal à utiliser juste

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

après un Ajax appel, et enfin trouvé que nous devons utiliser

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

ou la nouvelle méthode

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

pour lier le cas pour les nouveaux éléments créés après un appel Ajax.

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

Pour vivre

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