Tutorials > HTML > Tutorial-Detail: Seitenwechsel via Drop Down Box

Seitenwechsel via Drop Down Box

Man möchte keine nervige Navigation, in der alles gelistet ist? Dann müsst ihr dieses Tutorial lesen. So geht eine Navigation mit einer DropDown-Box.

Man macht einfach eine Drop Down Box und nennt diese "N" (Sie kann auch anders genannt werden, muss aber im JavaScript Code auch geändert werden).

Code:

<form name="frm">
<select size="1" onchange="Go()" name="N">
<option selected="selected" value="index.html">Startseite</option>
<option value="login.html">Login</option>
<option value="register.html">Anmelden</option>
</select>
</form>

Ihr werdet bestimmt erkannt haben, das unter "select" die Funktion "onchange=Go()" eingebaut ist. Das ist der eigentliche Code. Bei Wechsel der Option (also dem Navigationspunkt) im Select-Feld soll diese Seite aufgerufen werden und zwar im selben Fenster. Jetzt kommt der JavaScript Code, der muss in den <head>-Bereich:

Code:

Hier findet ihr die Funktion Go() wieder.
location.href bedeutet, das die aktuelle Seitenadresse geändert werden soll. document.frm.N.value bezeichnet den Wert aus der Drop-Downbox (value="..." im <option>-Feld). Und zusammen:
Wenn man bei der Selectbox die Option ändert, wird man auf die Seite weitergeleitet, die mit dem Code unter "value" eingestellt wird.

Weiterführende Links:
Mein Tutorial auf web-banana.net

Geschrieben von snake.logan am 26.11.2006 (5656x gelesen)

weiterempfehlen

Druckversion

kommentieren