Les sélecteurs jQuery ne fonctionnent pas ou ne peuvent pas lier les événements

Question

J'ai plusieurs liens et formulaires créés dynamiquement sur une page avec les ID sub_comment_form_[id] et sub_add_comment_[id], respectivement. Je suis en train de:

1. Cacher toutes les formes quand la page se charge
2. Bind un événement click sur le lien directement au-dessus du formulaire pour masquer/afficher la forme.

Je ne sais pas s'il y a un problème avec mes sélecteurs, ou si jQuery ne permet tout simplement pas lier sur plusieurs objets à la fois. Voici mon code:

HTML

<a href="#" id="sub_add_comment_to_answer_[id]">Add comment</a> 
<form id="sub_comment_form_to_answer_[id]"... 

jQuery

$("form[ @id^='sub_comment_form' ]").hide(); 

$("a[ @id^='sub_add_comment' ]").click(function() { 
    var sibform = $(this).next("form"); 

    if (sibform.is(':hidden')) { 
    $(this).text('Cancel'); 
    sibform.slideDown('fast'); 
    } else { 
    $(this).text('Add comment'); 
    sibform.slideUp('fast'); 
    } 
}); 

Answer 1

Si vous utilisez une version plus récente de jQuery (1.3+) il n'y a pas @ plus sur les sélecteurs d'attributs , il ressemble à ceci:

$("form[id^='sub_comment_form']").hide(); 
//and.. 
$("a[id^='sub_add_comment']").click(function() { 

Ce premier manquait aussi une accolade de fermeture, alors assurez-vous de corriger cela aussi :)

Aussi, assurez-vous que ces deux sont enveloppés dans un gestionnaire document.ready afin qu'ils exécutent après le DOM est prêt, comme ceci:

$(function() { 
    $("form[id^='sub_comment_form']").hide(); 
    $("a[id^='sub_add_comment']").click(function() { ... }); 
}); 

---

Sinon, au lieu de ces ID commence avec sélecteurs vous pouvez utiliser une classe, par exemple:

<a href="#" class="addComment">Add comment</a> 

Et lier comme ceci:

$("a.addComment").click(function() { ... }); 

Answer 2

Ligne 1 manque la fermeture « ] » il devrait être ...

$("form[@id^='sub_comment_form']").hide(); 

Answer 3

Il est également une bonne pratique de préfixer les variables contenant des objets avec jQuery un $. De cette façon, vous savez toujours quand vous avez affaire à un objet jQuery et non. Et ainsi vous empêche de lier un objet jQuery en lui-même.