web-dev-qa-db-fra.com

Liaison jQuery cliquez sur un lien après AJAX call

Je deviens furieux - peut-être que quelqu'un pourra m'aider avec ça.

J'ai besoin de relier le clic au lien après AJAX appel, mais pour une raison quelconque, il ne veut pas fonctionner.

Voici mon code:

if ($('.active').length > 0) {
    $('.active').click(function() {
        var elem = $(this);
        var url = $(this).attr('href');
        $.ajax({
            url: url,
            dataType: 'html',
            success: function(data) {
                elem.replaceWith(data);                                                     
            }       
        });         
        $('.active').bind('click'); return false;           
    });
}

Une idée?

Merci pour les réponses - j'ai modifié le code, mais le problème est toujours là:

function makeActive() {
    if ($('.active').length > 0) {
        $('.active').click(function() {
            var elem = $(this);
            var url = $(this).attr('href');
            $.ajax({
                url: url,
                dataType: 'html',
                success: function(data) {
                    elem.replaceWith(data);                             
                }       
            }); 
            $('.active').live('click', makeActive);     
            return false;           
        });
    }
}


$('.active').live('click', makeActive);
jquerybind
19
user398341

Vous devriez ajouter la reliure dans le gestionnaire success si vous voulez l'exécuter après l'appel Ajax:

success: function(data) {
    elem.replaceWith(data);
    $('.active').bind('click', /* some function needs to go here*/);
}

Cela dit, dans ce cas, live() ou delegate() sont probablement de meilleures options [ mise à jour: maintenant que jQuery 1.7 est sorti, tout peut être fait avec .on()] . Cela empêcherait également la double affectation des gestionnaires de clics, au cas où vous auriez d'autres liens .active Qui n'ont pas été remplacés.

Mise à jour: Concernant votre code mis à jour: La façon dont vous utilisez live va à l'encontre de son objectif. Veuillez lire son documentation . Ce que vous faites consiste à affecter un gestionnaire de clics lorsque vous cliquez sur le lien, ce qui signifie que vous ajoutez des gestionnaires de clics à plusieurs reprises.

Il s'agit d'une version améliorée de votre code.

$('.active').live('click', function(event) {
    var elem = $(this);
    var url = $(this).attr('href');
     $.ajax({
         url: url,
         dataType: 'html',
         success: function(data) {
              elem.replaceWith(data);                             
         }       
     });    
     event.preventDefault();
     event.stopPropagation();
});
21
Felix Kling

[~ # ~] mise à jour [~ # ~] le 31 octobre 2012

A partir de jQuery 1.7, l'approche recommandée est d'utiliser on -

$(document).on('click', '.active', function () {
    // click handler code goes here
});

Pouvez-vous essayer ce qui suit?

$('.active').live('click', function()
{
    // click handler
});
32
MD Sayem Ahmed