Metodo toggleClass
Il metodo toggleClass alterna l'aggiunta/rimozione
di una classe CSS: se non è presente la aggiunge, se è presente la rimuove.
Sintassi
Una classe CSS:
$(selettore).toggleClass(nome classe);
Aggiungere o rimuovere la classe CSS solo in base
al secondo parametro, che accetta valori
true o false:
$(selettore).toggleClass(nome classe CSS, stato);
Multiple classi CSS:
$(selettore).toggleClass(['classe1', 'classe2', 'classe3', '...']);
Aggiungere o rimuovere le classi CSS solo in base al secondo parametro:
$(selettore).toggleClass(['classe1', 'classe2', 'classe3', '...'], stato');
Applicazione di una funzione a ogni elemento nel set,
lo stato può essere true o false,
e indica al metodo di solo aggiungere o solo
rimuovere la classe CSS:
$(selettore).toggleClass(function(indice nel set, classi correnti dell'elemento, stato), [stato]);
Esempio
Il nostro paragrafo ha già due classi. Aggiungiamogli
anche la classe www:
<p id="test" class="eee ggg">testo</p>
$('#test').toggleClass('www');
Il codice HTML risulterà così:
<p id="test" class="eee ggg www">testo</p>
Esempio
E ora la classe www è già presente nell'elemento
- rimuoviamola:
<p id="test" class="eee ggg www">testo</p>
$('#test').toggleClass('www');
Il codice HTML risulterà così:
<p id="test" class="eee ggg">testo</p>
Vedi anche
-
metodi
addClass,removeClass,hasClass -
Proprietà JavaScript
classList,
che può essere utilizzata per alternare l'aggiunta/rimozione di classi in JavaScript puro
