SimpleBlog

Gettin' it simple.

Flower

JavaScript: Toggle der Anzeige in einer Zeile

Jeder, der eine Website mit ein Wenig Interaktivität versehen möchte kennt es:
Das Auf- bzw. Zuklappen von Elementen via JavaScript.

Zum Beispiel das folgende Rechteck [-]:

o

Es kann, ganz einfach durch Klick ein- bzw. ausgeblendet werden. Alles dafür notwendige steht im “onclick”-Tag des Links, der zwischen den eckigen Klammern steht:

document.getElementById(‘rectangle’).style.display=
(document.getElementById(‘rectangle’).style.display==’block’?'none’:'block’);

(natürlich ohne den Umbruch, der hier leider notwendig ist)

Was daran so interessant ist?
Es ist keine weitere Funktion nötig, um dieses Togglen zu erreichen. Einzig um den Text zu ändern nutze ich eine andere Funktion:

document.getElementById(‘toggle’).innerHTML=
(document.getElementById(‘rectangle’).style.display==’block’?'-’:'+’)

Das stellt – finde ich zumindest – eine viel bessere Art da, Dinge mit JavaScript zu toggeln.

    Verfassen Sie einen Kommentar

    *
    To prove you're a person (not a spam script), type the security word shown in the picture. Click on the picture to hear an audio file of the word.
    Click to hear an audio file of the anti-spam word