Metoden toggleClass
Metoden toggleClass växlar mellan att lägga till/ta bort
en CSS-klass: om den inte finns - läggs den till, om den finns - tas den bort.
Syntax
En CSS-klass:
$(selektor).toggleClass(klassnamn);
Bara lägga till eller ta bort CSS-klass beroende
på den andra parametern, som tar värdena
true eller false:
$(selektor).toggleClass(CSS-klassnamn, tillstånd);
Flera CSS-klasser:
$(selektor).toggleClass(['klass1', 'klass2', 'klass3', '...']);
Bara lägga till eller ta bort CSS-klasser beroende på den andra parametern:
$(selektor).toggleClass(['klass1', 'klass2', 'klass3', '...'], tillstånd');
Tillämpa en funktion på varje element i uppsättningen,
tillstånd kan vara true eller false,
och anger för metoden - bara lägga till eller bara
ta bort CSS-klass:
$(selektor).toggleClass(function(nummer i uppsättningen, elementets nuvarande klasser, tillstånd), [tillstånd]);
Exempel
Vårt stycke har redan två klasser. Låt oss
lägga till klassen www till det:
<p id="test" class="eee ggg">text</p>
$('#test').toggleClass('www');
HTML-koden kommer att se ut så här:
<p id="test" class="eee ggg www">text</p>
Exempel
Och nu finns klassen www redan i elementet
- låt oss ta bort den:
<p id="test" class="eee ggg www">text</p>
$('#test').toggleClass('www');
HTML-koden kommer att se ut så här:
<p id="test" class="eee ggg">text</p>
Se även
-
metoderna
addClass,removeClass,hasClass -
JavaScript-egenskapen
classList,
som kan användas för att växla mellan att lägga till/ta bort klass i ren JavaScript