jQuery (coffeescript) liens dynamiques

Question

Pour être court et précis:

J'ai un lien, en cliquant sur lequel un nouveau div est inséré dans la liste. Chaque div contient un lien pour supprimer cette div.

Ainsi, au milieu de travail, il ressemble à ceci:

<div id="list"> 
    <div id="item"><a href="#" id="remove_item">Remove</a></div> 
    <div id="item"><a href="#" id="remove_item">Remove</a></div> 
</div> 

Quant au gestionnaire de clic je

$("#remove_item").live 'click', (e) -> 
    $(this).parent().remove() 
    $(this).die() # Unbind 

Maintenant, mon problème est ici dans le comportement bizarre de ce gestionnaire . Si je clique sur le lien du tout dernier DIV inséré, il est retiré correctement, mais si je clique sur le tout premier - à part qu'il est retiré, il enlève aussi chacun d'entre eux, qui se trouve debout après il. Donc, en cliquant sur le premier, va, en gros, tout enlever.

Et je n'ai besoin de retirer que l'actuel, évidemment! :)

Et je n'ai pas la moindre idée, pourquoi la déliaison ne fonctionne pas. Je ne sais pas si c'est lié à plusieurs tirs ou non. :(

que quelqu'un peut me aider avec celui-ci?

Answer 1

OK. Je ne sais pas quel était le problème, mais après avoir réarrangé une partie de la mise en page HTML, le problème a été résolu. Et je ne comprends toujours pas la raison. Ah bien, peu importe. Merci à vous tous qui avez essayé d'aider! :)

Answer 2

Cela devrait être un commentaire, mais pas encore assez de points.

Tout d'abord, pensez à utiliser .on() et .off comme .live() est obsolète .

Je ne peux pas reproduire votre problème, votre morceau de code fonctionne pour moi ici, sans doute quelque chose de mal avec de multiples liaison et déliaison, comme vous le mentionnez. peut-être un peu plus de code serait utile.

De plus, vous ne devriez pas utiliser le même identifiant. Les identifiants doivent être uniques pour chaque élément, mieux vaut avoir un class="remove_item" et un identifiant unique pour chaque div.

Answer 3

L'ID d'un élément DOM doit être unique.

Vous avez probablement juste besoin de changer ceci:

<div id="list"> 
    <div id="item"><a href="#" id="remove_item">Remove</a></div> 
    <div id="item"><a href="#" id="remove_item">Remove</a></div> 
</div> 

à ceci:

<div id="list"> 
    <div class="item"><a href="#" class="remove_item">Remove</a></div> 
    <div class="item"><a href="#" class="remove_item">Remove</a></div> 
</div> 

Avec le CoffeeScript lié à changé:

$(".remove_item").live 'click', (e) -> 
    $(this).parent().remove() 

Aussi, je suis assez Bien sûr, vous n'avez pas besoin d'appeler $(this).die(), car vous voulez toujours que les autres DIV soient supprimables.