Toggle Font-Awesome Icon funktioniert nur bedingt

  • Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

StephanBo

Mitglied
28 Januar 2012
175
0
16
HTML:
<i onclick="myFunction(this)" class="fa fa-thumbs-up"></i>

Javascript:
<script>
function myFunction(x) {
x.classList.toggle("fa-thumbs-down");
}
</script>

Obiger Code funktioniert leider nur bedingt. Klicke ich auf das Icon, verändert es sich auch, wie es soll (Daumen rauf wird zu Daumen runter).

Komischerweise kann ich die Klasse aber nicht ändern. Wenn ich z.B. im HTML-Code aus class="fa fa-thumbs-up" -> class="fa fa-thumbs-down" mache und entsprechend im javascript-code aus x.classList.toggle("fa-thumbs-down"); -> x.classList.toggle("fa-thumbs-up"); mache, geht das Togglen nicht mehr.

Wo liegt hier der Fehler?
 

StephanBo

Mitglied
28 Januar 2012
175
0
16
Danke schon mal für die Antwort.

Die neue Klasse die getoggelt werden soll ist ja die "fa-thumbs-up " und das funktioniert auch ohne Probleme.

Aber warum kann ich kein anderes Symbol aus dem FontAwesome-Satz reintoggeln, außer "fa-thumbs-down"? Jeder FA-Satz ist ja schließlich eine definierte Klasse.
 

StephanBo

Mitglied
28 Januar 2012
175
0
16
Hat super geklappt. Vielen Dank. Wenn es jetzt noch ein Font-Awesome Blank Icon geben würde, wäre alles perfekt. Aber wie es aussieht, gibt es den nicht im FA-Set.
 
Werbung: