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

Active button

sunil2809

Mitglied
Hallo zusammen,

ich habe gestern einen script geschrieben, der bewirkt, dass wenn man auf ein Element klickt, es einen anderen CSS Style bekommt. So zusagen einen "active" Status. Die active-funktion funktioniert auch, aber ich habe noch nicht heraus gefunden, wie man es hinbekommt, dass wenn man auf ein 2. Element klickt das 1., das vorher 'active' war, seine Eigenschaft wieder verliert. (Ich hoffe, ihr versteht, was ich meine)

Mein Code sieht folgendermaßen aus:

Javascript:
function active(x) {
  x.style.textDecoration = "line-through";
}
HTML:
<nav>
    <ul>
      <li><a href="#home" onclick="active(this);">home</a></li>
      <li><a href="#work" onclick="active(this);">work</a></li>
      <li><a href="#about" onclick="active(this);">about</a></li>
    </ul>
  </nav>

Ich freue mich auf eure Antworten!

Beste Grüße
Linus
 
Werbung:
Da du Vanilla-JS benutzt, müsstest du dann wohl sowas wie querySelectorAll (oder ähnliches) verwenden, eine Schleife drüberlaufen lassen, die jedes Element zurücksetzt. Ist die Schleife fertig, versetzt du das geklickte Element wieder in den active-Zustand.

Wenn du aber wirklich nur 3 Buttons hast, kannst du dir theoretisch auch die Schleife sparen und einfach 3 mal getElementByID benutzen.
 
Zurück
Oben