Zugriff auf Formulare - JavaScript: Die Universelle Sprache zur Web-Programmierung - page 348

<option id="f">Familie</option></select></form>
<hr/><div id="info"></div>
</body>
</html>
Sie sehen eine einfache Auswahlliste. Hier ist die JavaScript-Datei kap12_3.js:
Listing 12.8■ Der Zugrif auf den ausgewählten Eintrag in der Auswahlliste
function init(){
document.forms[0].elements[0].defaultChecked = true;
document.getElementById("t").onchange = function(){
welcherIndex(this);
}
}
function welcherIndex(i){
document.getElementById("info").innerHTML = "Ausgewählter Eintrag: " +
i.selectedIndex;
}
window.onload = init;
In der Funktion init() können Sie erkennen, dass der Eventhandler onchange beim Con-
tainer der Auswahlliste verwendet wird. Dieser Container hat die Id t . Sie sehen, dass wir
das auslösende Objekt der Funktion welcherIndex() als Parameter übergeben und mit der
Eigenschat selectedIndex den Index des ausgewählten Eintrags in der Auswahlliste be -
stimmen können.
Bild 12.3■ Der selektierte Index (beginnend bei 0) wird angezeigt.
Nun stellt sich noch die Frage, wie man an den Text kommt, der hinter den Einträgen einer
Auswahlliste liegt und dem Anwender angezeigt wird? In vielen Browsern können Sie ein-
fach die Eigenschat value des auslösenden select -Elements verwenden. Leider geht das
aber nicht in allen Browsern wie z. B. in alten Versionen des Internet Explorers und im
Grunde ist der Zugrif über value auch nicht ganz logisch.