Sélection de plusieurs classes avec jQuery

222

J'ai bien regardé et je n'arrive pas à trouver comment sélectionner tous les éléments correspondant à certaines classes dans une instruction de sélecteur jQuery comme celle-ci:

$('.myClass', '.myOtherClass').removeClass('theclass');

Des idées sur la façon d'y parvenir? La seule autre option est de faire

$('.myClass').removeClass('theclass');
$('.myOtherClass').removeClass('theclass');

Mais je fais ça avec pas mal de classes, donc ça demande beaucoup de code.

javascript jquery jquery-selectors

— Kezzer
source

402

Cela devrait fonctionner:

$('.myClass, .myOtherClass').removeClass('theclass');

Vous devez ajouter tous les sélecteurs multiples dans le premier argument à $ (), sinon vous donnez à jQuery un contexte dans lequel effectuer la recherche, ce qui n'est pas ce que vous voulez.

C'est la même chose que vous feriez en CSS.

— Erik Bakker
source

3

Que faire si je veux le faire correspondre uniquement lorsque chacun des éléments possède toutes les classes spécifiées?

— IsmailS

12

Al right, j'ai eu celui-ci stackoverflow.com/q/1041344/148271 . en gros je vais devoir rejoindre tout le sélecteur d'intersection. Comme$(".myClass.myOtherClass")

— IsmailS

En savoir plus sur le regroupement CSS: "Groupement" du W3C .

— skrounge

@wal: Cette virgule est également nécessaire en CSS pour pointer vers les deux classes. Sans la virgule, il ferait référence à .myOtherClassquelque chose à l' intérieur .myClass.

— geekuality

cette réponse ne répond pas à la question, de cette façon vous faites un OU !!!! pas ET !!

— Mahmoud Khateeb

26

Avez-vous essayé cela?

$('.myClass, .myOtherClass').removeClass('theclass');

— Ionuț G. Stan
source

25

j'utilise $('.myClass.myOtherClass').removeClass('theclass');

— Adman
source

34

C'est le cas si un élément HTML a plusieurs classes et que vous souhaitez supprimer la classe de l'élément uniquement avec toutes ces classes. D'autres exemples suppriment la classe de tout élément avec l'une des classes séparées par des virgules. Votre exemple ne fonctionnerait que si mon élément HTML avait les deux , comme<div class="myClass myOtherClass theclass">

— Kezzer

0

// Due to this Code ): Syntax problem.    
$('.myClass', '.myOtherClass').removeClass('theclass');

Selon la documentation jQuery: https://api.jquery.com/multiple-selector/

Quand peut-on sélectionner plusieurs classes de cette manière:

jQuery(“selector1, selector2, selectorN”) // double Commas. // IS valid.
jQuery('selector1, selector2, selectorN') // single Commas. // Is valid.

en enfermant tous les sélecteurs dans une seule '...' ou double virgule, "..."

Donc, dans votre cas, la bonne façon d'appeler plusieurs classes est la suivante:

$('.myClass', '.myOtherClass').removeClass('theclass'); // your Code // Invalid.
$('.myClass , .myOtherClass').removeClass('theclass');  // Correct Code // Is valid.

— Rehan Shah
source