Link - Menue


Script im Headbereich

<script language="JavaScript" type="text/javascript">
<!--
function linkmenue() {
window.location=document.meinformular.meinmenue.options[document.meinformular.meinmenue.options.selectedIndex].value;
}
//-->
</script>

Script des Formulars

<form name="meinformular">
<select name="meinmenue">
<option value="../webtricks/formular/index.htm">Formular</option>
<option value="../webtricks/formular/auswahlliste.htm">Listen Menue</option>
<option value="fensterauf.htm">Fenster &ouml;ffnen</option>
<option value="function.htm">Funktion</option>
<option value="bgfarbe.htm">Hintergrundfarbe</option>
<option value="winobj.htm">Window Objekt</option>
<option value="eventhnd.htm">Event Handler</option>
</select>
<input type="button" value="Los gehts" onClick="linkmenue()" name="button">
</form>

Wo soll`s hingehen?

Erklärung:
Hier haben wir ein paar Links in eine Auswahlliste eingefügt.
Die links führen übrigens zu ein paar Seiten, die zu diesem Thema passen.
Der Javascript Befehl eine Seite zu öffnen sieht so aus:

window.location="seite.html";

Die Übergabe der ausgewählten Werte der Auswahlliste ist etwas kompliziert.
Zum besseren Verständniss will ich vorerst auf ein anderes Formularfeld verweisen, und zwar der Eingabewert eines Textfeldes namens meintextfeld aus dem Formular namens meinformular kann folgendermaßen zugewiesen werden:

document.meinformular.meintextfeld.value

In einer Auswahlliste ist das etwas komplizierter dazu erstmal der Quelltext einer Auswahlliste, wo mittels value ein anderer Wert übertragen wird, als der der angezeigt wird.

<select name="Pizza">
<option value="P101"> Pizza Napoli
<option value="P102"> Pizza Funghi
<option value="P103"> Pizza Capriciosa
</select>
Wir erinnern uns, will man in einer Auswahlliste eine Vorauswahl treffen, wird der option Tag um den Befehl selected erweitert.

<option selected> Hannibal Lector </option>

Schauen wir uns nun das Script an, welches, den ausgewählten Wert einer Auswahlliste übergibt (kein Zeilenumbruch!).
Man beachte, wie in der eckigen Klammer von options[]der ausgewählte Wert selectedIndex übergeben wird

document.meinformular.meinmenue.options[document.meinformular.meinmenue.options.selectedIndex].value;

Ich hoffe anhand der Beispiele kommt etwas Licht in dieses zugegebnermaßen etwas komplizierte Script. Es gibt selbstverständlich auch andere Wege ein solches Menue zu erstellen. Auf meiner Javascript- Linkseite findet ihr ein paar Seiten mit vielen Javascript Beispielen und auch ein paar anderen Menues in dieser Art.

 

Javascript Tipps