Java Reference
In-Depth Information
12.3■Zugrif auf ein Webformular
per JavaScript
Wie auf nahezu jedes andere DOM-Element können Sie mit JavaScript auf Formulare und
die enthaltenen Elemente zugreifen. Das Thema bietet also nichts Neues. Entweder greifen
Sie über das Objektfeld forms respektive elements oder auch options für die Formular-
elemente, einen Namen bzw. getElementsByName() , über eine ID mit getElementById() ,
getElementsByTagName("form") oder per this zu, wenn Sie aus einem selbst Formular
zugreifen wollen. Wenn Sie also nicht direkt den Knoten ansprechen (etwa über
getElementsByName() oder getElementById() ), müssen Sie beim Zugrif per Punktnota-
tion das Formular voranstellen.
12.3.1■Zugrif auf den Wert eines Formularelements
Mit Ausnahme des Containers einer Auswahlliste besitzt jede Objektrepräsentation eines
Formularelements die Eigenschat value . Damit können Sie mit Ausnahme eines Auswahl-
listencontainers den Wert eines beliebigen Formularelements abfragen oder setzen. Der
Datentyp der Eigenschat ist in jedem Fall ein String.
12.3.1.1■Vorbelegen von Eingabefeldern
Das nachfolgende Beispiel belegt die Werte von Textfeldern eines Formulars vor, wobei
damit auch der lesende Zugrif abgedeckt ist. Das geht im Grunde auch mit (X)HTML, aber
mit JavaScript können Sie hierbei natürlich bei Bedarf Programmierlogik einließen lassen.
Beispiel (kap12_1.html):
Listing 12.1■ Setzen und Auslesen der Werte von Formularelementen
...
<script src="lib/js/kap12_1.js" type="text/javascript"></script>
</head>
<body>
<h1>Die Felder in dem Formular sind vorbelegt</h1>
<form action="" method="get" name="a">
<input name="a" size="40" /><br/><input name="b" size="40" /><br/>
<input name="c" size="40" /><br/><input name="d" size="40" /><br/>
<input id="e" size="40" /><br/><input type="Submit" value="OK" />
</form>
</body>
</html>
Sie sehen hier ein ganz einfaches Formular. Beachten Sie, dass die Referenz auf die externe
JavaScript-Datei kap12_1.js im Problemfall bei alten Browsern auch an das Ende des Kör-
pers der Webseite verlegt werden kann, wobei wir in der JavaScript-Datei den Eventhandler
onload einsetzen und diese Komplikationen mittlerweile verschwunden sein sollten.
Schauen wir uns nun aber die JavaScript-Datei kap12_1.js an:
 
Search WWH ::




Custom Search