Ajouter et supprimer plusieurs classes dans jQuery


135

J'essaie d'ajouter et de supprimer plusieurs classes sur un champ de texte en cliquant sur différents boutons radio. Je ne parviens pas à supprimer les classes indésirables lors du passage d'un bouton radio à l'autre.

Mon code pour cela est:

// For 1st radio button
if (actionUrl == "search-client-by-id") {
    $("#req").removeClass("validate[required,custom[onlyLetterNumber],maxSize[20],custom[onlyLetterSp]]")
             .addClass("validate[required,custom[onlyNumberSp]]");
}
// For 2nd radio button
else if (actionUrl == "search-client-by-name") {    
    $("#req").removeClass("validate[required,custom[onlyNumberSp]]")
             .addClass("validate[required,custom[onlyLetterNumber],maxSize[20],custom[onlyLetterSp]]");
}

Réponses:


273

Vous pouvez séparer plusieurs classes avec l'espace:

$("p").addClass("myClass yourClass");

http://api.jquery.com/addClass/


1
J'ai trouvé une solution pour cela, chaque fois que j'utilise .removeClass () uniquement et pas besoin d'écrire un nom de classe dans removeClass pour supprimer toutes les classes ajoutées et ajouter n'importe quelle classe par choix. Oui ça marche ...!
Raman

3
L'utilisation de .removeClass () [sans paramètres] supprime toutes les classes de l'objet jQuery.
Ahmet

8

Ajouter plusieurs classes:

$("p").addClass("class1 class2 class3");

ou en cascade:

$("p").addClass("class1").addClass("class2").addClass("class3");

Très similaire aussi pour supprimer plus de classes:

$("p").removeClass("class1 class2 class3");

ou en cascade:

$("p").removeClass("class1").removeClass("class2").removeClass("class3");

alors que voulez-vous supprimer une classe de plusieurs $("p")?
fouet le

dans mon exemple, je fais référence à tous les paragraphes de la page mais ce n'est qu'un exemple. Vous pouvez identifier un élément spécifique avec un ID ou une autre classe.
Andrea_dev

0

moyen le plus simple d'ajouter le nom de la classe à l'aide de javascript. Cela peut être utile en cas de .siblings()mauvais comportement.

document.getElementById('myId').className += ' active';

5
Cette réponse n'est pas pertinente pour la question, qui demandait explicitement jQuery.
cyberbit

1
Et vous devriez quand même utiliser classList
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.