Java Reference
In-Depth Information
die Selektion der Einträge in der Aufzählungsliste einige überraschende Probleme bereiten.
Dementsprechend müssen Sie ziemlich aufpassen, wie Sie die Ereignisse auslösen und was
Ihnen wann und wie bereitgestellt wird. Und um gleich die Aufmerksamkeit zu schärfen -
wir müssen hier leider wieder einmal mit sehr browserabhängigen Verhaltensweisen bei
Auswahllisten kämpfen!
Obwohl es nun verschiedene Ansätze gibt, wie man auf Klicks auf Einträge in Auswahllisten
reagieren kann (etwa mit
onclick
bei den Elementen eines
<select>
-Containers oder auch
bei den einzelnen Einträge in den
<option>
-Containern), werden diese bei verschiedenen
Browsern zwar funktionieren, bei anderen aber nicht. Von daher sollten Sie in der Regel den
folgenden Weg gehen, wenn die Reaktion universell funktionieren soll.
Vergegenwärtigen wir uns nun erst einmal, was wir eigentlich wollen? Wir wollen testen
oder festlegen, welcher Eintrag in einer Auswahlliste selektiert ist. Die Objektrepräsentation
einer Auswahlliste (also des Containers selbst) besitzt dazu die Eigenschat
selectedIndex
.
Damit können Sie ermitteln, welcher Eintrag in einer Auswahlliste aktiviert ist, oder auch
einen Eintrag in der Auswahlliste aus JavaScript heraus selektieren. Allerdings werden Sie
feststellen, dass Sie damit auch Probleme bekommen, wenn Sie das auslösende Element
ungeschickt verwerten wollen. Wenn Sie jedoch
this
beim Auslösen eines Ereignisses aus
einer Auswahlliste als Parameter übergeben, sind Sie auf der sicheren Seite. Einen Eintrag
als selektiert zu markieren, ist auch nicht kompliziert. Sie müssen nur den passenden
numerischen Index eines Eintrags verwenden. Dazu setzen Sie die
selectedIndex
-Eigen-
schat auf den numerischen Wert des gewünschten Eintrags und damit ist das Element der
Auswahlliste selektiert. Alternativ können Sie aber auch mit der Eigenschat
selected
eines einzelnen Eintrags in der Auswahlliste arbeiten, die Sie selbstverständlich ebenso
abfragen wie zum Selektieren setzen können. So etwas würde also funktionieren:
Listing 12.6■
Selektion eines Eintrags in der Auswahlliste über die Eigenschat selected
function welcherIndex(i) {
window.document.a.b.options[i].selected=true;
}
In diesem Fall setzt man die Eigenschat
selected
einfach auf den Wert
true
beziehungs-
weise einen numerischen Wert ungleich 0 - dann ist das Element selektiert - oder den Wert
false
beziehungsweise 0 - in diesem Fall ist das Element deselektiert. Wenn ein Eintrag als
selektiert gesetzt wird, deselektiert das alle anderen Einträge, sofern keine Mehrfachselek-
tion vorgesehen ist. Unsere zweite Überlegung betrit den Eventhandler, den wir bei der
Auswahlliste verwenden. Wir werden statt
onclick
auf
onchange
umsteigen. Mit
onchange
werden wir ein Ereignis erst dann auslösen, wenn ein Eintrag in der Auswahlliste selektiert
(oder genauer geändert) wird. Betrachten Sie das nachfolgende Beispiel
(kap12_3.html):
Listing 12.7■
Bestimmen des ausgewählten Eintrags in der Auswahlliste
...
<script src="lib/js/kap12_3.js" type="text/javascript">
</script>
</head>
<body>
<h1>Selektion bei Auswahllisten</h1>
<form><select name="ticket" id="t">
<option id="e">Erwachsener</option><option id="k">Kind</option>
Search WWH ::
Custom Search