jQuery: sélection par classe et type d'entrée

119

Je voudrais sélectionner un ensemble d'éléments qui sont tous deux d'un certain type d'entrée (par exemple, une case à cocher) et ont une certaine classe en utilisant jQuery. Cependant, lorsque j'essaye ce qui suit:

 $("input:checkbox .myClass")

Je ne reçois aucun article retourné. Comment puis-je accomplir cela dans jQuery?

Brian Sullivan
la source

Réponses:

209

Votre sélecteur recherche tous les descendants d'un élément de case à cocher qui ont une classe de .myClass.

Essayez plutôt ceci:

$("input.myClass:checkbox")

Découvrez-le en action .

J'ai également testé ceci:

$("input:checkbox.myClass")

Et cela fonctionnera également correctement. À mon humble avis, cette syntaxe a vraiment l'air plutôt moche, car la plupart du temps, je m'attends à ce que les :sélecteurs de style soient les derniers. Comme je l'ai dit, cependant, l'un ou l'autre fonctionnera.

Paolo Bergantino
la source
51

Si vous souhaitez obtenir les entrées de ce type avec cette classe, utilisez:

$("input.myClass[type=checkbox]")

la syntaxe du sélecteur [] vous permet de vérifier l'un des attributs des éléments. Consultez les spécifications pour plus de détails

BaroqueBobcat
la source
6

Vous devez utiliser (pour les cases à cocher) :checkboxet l' .nameattribut pour sélectionner par classe.

Par exemple:

$("input.aclass:checkbox")

Le :checkboxsélecteur:

Correspond à tous les éléments d'entrée de type case à cocher. Utiliser ce psuedo-selector comme $(':checkbox')équivaut à $('*:checkbox') ce qu'un sélecteur lent. Il est recommandé de le faire $('input:checkbox').

Vous devriez lire la documentation de jQuery pour connaître les sélecteurs.

eKek0
la source
4

Vous devriez utiliser le nom de la classe comme ceci

$(document).ready(function(){
    $('input.addCheck').prop('checked',true);
});

Essayez d'utiliser cette démo en direct

Akhil Chandran
la source
1
la réponse n'est pas pertinente à la question.
Avnish alok
1
Pourtant, la réponse est entièrement utile à ceux qui recherchent des choses similaires, mais pas la question exacte du PO.
camdixon
3

Essaye ça:

$("input:checkbox").hasClass("myClass");
Fabio Padoue
la source
3

Juste au cas où des mannequins comme moi ont essayé les suggestions ici avec un bouton et n'ont trouvé rien de fonctionné, vous voulez probablement ceci:

$(':button.myclass')
iforce2d
la source