jQuery next() ne fonctionne pas avec live()

Lorsque j'essaie d'utiliser la méthode jQuery next(), cela ne fonctionne pas avec live().jQuery next() ne fonctionne pas avec live()

Tout d'abord, voici mon code:

$(".toggle_button").live('click', function() { 
    $(this).html($(this).html() == '-' ? '+' : '-'); 
    $(this).next(".info_section").toggle(400); 
});

Voici le HTML

<div class='section_toggle_container'> 
    <div class='toggle_button'>-</div> 
    <strong>Driver Information:</strong> 
</div> 
<div class='info_section'> 
    info here 
</div>

le problème se situerait peut-être dans le fait que .toggle_button est imbriquée, ce qui rend .info_section injoignable?

La deuxième ligne fonctionne très bien, car elle modifie l'élément en raison de l'événement live(). La troisième ligne, cependant, est où le problème est à. C'est parce qu'il utilise next().

Quelqu'un peut-il m'aider avec une solution pour mon problème next()?

Source

2011-01-17 Bojangles

Vous aurez besoin de montrer le HTML cela s'applique à je pense. Est-il possible qu'il n'y ait pas de ".info_section" après l'élément '.toggle_button'? Ou détruisez-vous 'this' avec l'appel' .html() 'dans la ligne ci-dessus? Essayez d'utiliser '.text()' à la place. – Orbling

pouvons-nous vous voir code html? – amosrivera

Quel est exactement le problème? ** Comment votre HTML ressemble-t-il?** 'next()' ne retournera qu'un élément ** si et seulement si ** le prochain frère de 'this' a la classe' info_section'. Il ne renvoie pas ** ** le frère suivant avec la classe 'info_section'. –

En regardant le HTML should't votre déclaration:

$(this).next(".info_section").toggle(400);

être:

$(this).parent().next(".info_section").toggle(400);

Source

2011-01-17 23:43:30 Neil

Pendant que vous avez la réponse de travail, je voulais laisser une suggestion au sujet de votre basculement du - et +, je suggère d'utiliser text() au lieu de HTML, et en utilisant le text inhérent (pour text(), html pour html()):

$(".toggle_button").live('click', function() { 
    $(this).text(function(index,text) { 
     return text == '-' ? '+' : '-'; 
    }); 
    $(this).parent().next(".info_section").toggle(400); 
});

Et, plus loin, je vous suggère de mettre en cache votre $(this), si vous appelez plus d'une fois qu'il est utile de recourir à la mise en cache pour éviter d'avoir à le recréer par la suite, ce qui conduit à:

$(".toggle_button").live('click', function() { 
    var $this = $(this); 
    $this.text(function(index,text) { 
     return text == '-' ? '+' : '-'; 
    }); 
    $this.parent().next(".info_section").toggle(400); 
});

de Bien sûr, si vous utilisez une version de jQuery supérieure ou y compris, 1.7, alors vous devriez utiliser la méthode on(), plutôt que (depuis jQuery 1.7) dépréciée live(), ce qui donnerait:

$(".toggle_button").on('click', function() { 
    var $this = $(this); 
    $this.text(function(index,text) { 
     return text == '-' ? '+' : '-'; 
    }); 
    $this.parent().next(".info_section").toggle(400); 
});

Ceci est vraiment juste un conseil, malheureusement, affiché comme une réponse pour éviter que le code incompréhensible soit collé dans un commentaire.

Références:

Source

2012-07-31 16:54:35

jQuery next() ne fonctionne pas avec live()

Répondre

Questions connexes