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]]");
}
javascript jquery Raman
la source

Réponses:

273

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

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

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

Headshota
la source
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");
Andrea_dev
la source
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';
argoden
la source
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