Hallo,
ich kenne mich mit JavaScript nur wenig aus und habe ein Script von Dr.Web erweitert.
Es gibt hier drei Select-Boxen. Der Inhalt der zweiten wird der Auswahl der ersten Box entsprechend angepasst. Wenn ich dann die Auswahl in der zweiten Box treffe wird der Inhalt in der dritten entsprechend angepasst.
Das was mich wurmt: es funktioniert in allen Browsern nur auf dem IE 6 funktioniert es nicht richtig. Nach Auswahl in der zweiten Box ist die dritte Box *leer*!! Wenn es gar nicht funktionieren würde würde mich das weniger wurmen ;)
Die JavaScript Konsole sagt es gibt keine Fehler und das HTML ist Valide. Hier könnt ihr euch das Beispiel ansehen:
http://www.zschille.net/dynamische-auswahlliste.htm
Und hier der ganze Code:
--------------------------------------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Dynamische Auswahlliste</title>
<script language="Javascript" type="text/javascript">
<!--
function update_auswahl()
{
var kategorieAuswahl = document.forms.verzeichnis.kategorie;
var unterkategorieAuswahl = document.forms.verzeichnis.unterkategorie;
var unterunterkategorieAuswahl = document.forms.verzeichnis.unterunterkategorie;
unterkategorieAuswahl.options.length = 0; // DropDown Menü entleeren
unterunterkategorieAuswahl.options.length = 0; // DropDown Menü 2 entleeren
if (kategorieAuswahl.options
[kategorieAuswahl.selectedIndex].
value == "Hund")
{
unterkategorieAuswahl.options[0] = new Option("Futter wählen");
unterkategorieAuswahl.options[1] = new Option("HundeFutter");
unterkategorieAuswahl.options[2] = new Option("Pedigree Pal");
}
else if (kategorieAuswahl.options
[kategorieAuswahl.selectedIndex].
value == "Katze")
{
unterkategorieAuswahl.options[0] = new Option("Futter wählen");
unterkategorieAuswahl.options[1] = new Option("Kitekat");
unterkategorieAuswahl.options[2] = new Option("Brekkies");
}
else if (kategorieAuswahl.options
[kategorieAuswahl.selectedIndex].
value == "Maus")
{
unterkategorieAuswahl.options[0] = new Option("Futter wählen");
unterkategorieAuswahl.options[1] = new Option("Mais");
unterkategorieAuswahl.options[2] = new Option("Speck");
}
}
function update_auswahl_2()
{
var unterkategorieAuswahl = document.forms.verzeichnis.unterkategorie;
var unterunterkategorieAuswahl = document.forms.verzeichnis.unterunterkategorie;
//unterunterkategorieAuswahl.options.length = 0; // DropDown Menü 2 entleeren
if (unterkategorieAuswahl.options
[unterkategorieAuswahl.selectedIndex].
value == "HundeFutter")
{
unterunterkategorieAuswahl.options[0] = new Option("Hundelekker");
unterunterkategorieAuswahl.options[1] = new Option("Schmakko");
}
else if (unterkategorieAuswahl.options
[unterkategorieAuswahl.selectedIndex].
value == "Pedigree Pal")
{
unterunterkategorieAuswahl.options[0] = new Option("Pedi-Supi");
unterunterkategorieAuswahl.options[1] = new Option("Ein ganzer Kerl");
}
else if (unterkategorieAuswahl.options
[unterkategorieAuswahl.selectedIndex].
value == "Brekkies")
{
unterunterkategorieAuswahl.options[0] = new Option("Brekki-Supi");
unterunterkategorieAuswahl.options[1] = new Option("Knusprig");
}
else if (unterkategorieAuswahl.options
[unterkategorieAuswahl.selectedIndex].
value == "Kitekat")
{
unterunterkategorieAuswahl.options[0] = new Option("Katzischmatzi");
unterunterkategorieAuswahl.options[1] = new Option("Kitti");
}
else if (unterkategorieAuswahl.options
[unterkategorieAuswahl.selectedIndex].
value == "Mais")
{
unterunterkategorieAuswahl.options[0] = new Option("Maisischmatzi");
unterunterkategorieAuswahl.options[1] = new Option("Popcorn");
}
else if (unterkategorieAuswahl.options
[unterkategorieAuswahl.selectedIndex].
value == "Speck")
{
unterunterkategorieAuswahl.options[0] = new Option("Mausespeck");
unterunterkategorieAuswahl.options[1] = new Option("Fett");
}
}
//-->
</script>
</head>
<body>
<form name="verzeichnis" action="mailto:info@domain.de">
<select size="1" name="kategorie" onchange="update_auswahl()">
<option value="Hund" selected>Hund</option>
<option value="Katze">Katze</option>
<option value="Maus">Maus</option>
</select>
<select size="1" name="unterkategorie" onchange="update_auswahl_2()">
<option selected>bitte wählen</option>
<option>HundeFutter</option>
<option>Brekkies</option>
<option>MauseFutter</option>
</select>
<select size="1" name="unterunterkategorie">
<option selected></option>
<option>bellen</option>
<option>miauen</option>
<option>piiiepsen</option>
</select>
<input type="submit" value="Senden">
</form>
</body>
</html>
-----------------------------------------------
Weiss jemand wo hier der Fehler liegt?
Vielen Dank für die Hilfe im vorraus!
Liebe Grüße,
Daviz