Metoda toggleClass
Metoda toggleClass alternează adăugarea/eliminarea
unei clase CSS: dacă nu există - o va adăuga, dacă există - o va elimina.
Sintaxă
O singură clasă CSS:
$(selector).toggleClass(numele clasei);
Doar adaugă sau elimină o clasă CSS în funcție
de al doilea parametru, care acceptă valori
true sau false:
$(selector).toggleClass(numele clasei CSS, stare);
Mai multe clase CSS:
$(selector).toggleClass(['clasa1', 'clasa2', 'clasa3', '...']);
Doar adaugă sau elimină clasele CSS în funcție de al doilea parametru:
$(selector).toggleClass(['clasa1', 'clasa2', 'clasa3', '...'], stare');
Aplicarea unei funcții pentru fiecare element din set,
starea poate fi true sau false,
și indică metodei - doar să adauge sau doar
să elimine clasa CSS:
$(selector).toggleClass(function(număr în set, clasele curente ale elementului, stare), [stare]);
Exemplu
Paragraful nostru are deja două clase. Să-i
adaugăm și clasa www:
<p id="test" class="eee ggg">text</p>
$('#test').toggleClass('www');
Codul HTML va arăta astfel:
<p id="test" class="eee ggg www">text</p>
Exemplu
Și acum clasa www există deja în element
- să o eliminăm:
<p id="test" class="eee ggg www">text</p>
$('#test').toggleClass('www');
Codul HTML va arăta astfel:
<p id="test" class="eee ggg">text</p>
Vedeți și
-
metodele
addClass,removeClass,hasClass -
Proprietatea JavaScript
classList,
cu ajutorul căreia puteți alterna adăugarea/eliminarea unei clase în JavaScript simplu