HTML5-Handbuch - die neuen Features von HTML5
notiert:
onsubmit
. Dieses Ereignis wird ausgelöst, wenn der Anwender das Formular mit Hilfe der Submit-Schaltfläche absendet. Der zugewiesene Scriptcode wird ausgeführt, bevor die beim
action
-Attribut angegebene URL-Adresse aufgerufen wird. Die URL-Adresse wird nur dann aufgerufen, wenn der ausgeführte JavaScript-Code am Ende den Wert
true
(wahr) zurückliefert. Gibt der Scriptcode
false
(falsch) zurück, wird das Absenden des Formulars verhindert. Deshalb wird der
onsubmit
-Handler gerne eingesetzt, um Formulareingaben vor dem Absenden auf Vollständigkeit und Plausibilität zu überprüfen. Im obigen Beispiel wird einfach nur die Eingabe aus dem Feld für die Mailadresse behandelt. Alle darin eingegebenen Großbuchstaben werden in Kleinbuchstaben umgewandelt. Das besorgt im Beispiel die Funktion
prepareInput()
, die bei
onsubmit
aufgerufen wird und ebenfalls im Dokumentkopf notiert ist.
Bild 10.3: Formular-Event-Beispiele im Browser
Weitere Hinweise
Auch wenn es mit Hilfe von JavaScript möglich ist, Formulareingaben schon vor dem Formularversand auf Vollständigkeit und Plausibilität zu kontrollieren: Verlassen Sie sich niemals darauf, dass nach dem Formularversand nur vollständige und ordentliche Daten am Server ankommen! Bei deaktiviertem JavaScript etwa können Anwender ein Formular ohne jede Kontrolle ausfüllen und absenden. Eine clientseitige Eingabekontrolle mittels JavaScript kann also keine serverseitige Überprüfung der Formulardaten ersetzen.
Referenzinformationen
Eventreferenz
onblur
,
Eventreferenz
onchange
,
Eventreferenz
onsubmit
:
Es gibt weitere Event-Handler für interaktive Elemente, beispielsweise die neuen HTML5-Handler für
video
- und
audio
-Elemente (
oncanplay
,
onplay
,
onplaying
usw.). Details finden Sie in HTML-Eventreferenz .
10.1.4 Event-Handler für Fenster- und Dokumentereignisse
Einige Ereignisse betreffen das gesamte Dokument oder das gesamte Browser-Fenster. So gibt es beispielsweise das Ereignis
onload
, das eintritt, nachdem ein HTML-Dokument, mit all den darin referenzierten Ressourcen, vollständig geladen ist.
Im Dokumentmodell von HTML5 gibt es die Objekte
window
und
document
, auf deren Ebene solche Ereignisse behandelt werden können. In Form von HTML-Attributen werden diese Event-Handler im einleitenden
-Tag notiert.
Beispiel
Ereignisse für Fenster und Dokument
onunload="saveTime()" onerror="errorInfo();">
00:00
Übungsaufgabe
Du hast 5 Minuten Zeit, die nachfolgende Übung zu
absolvieren. Oben siehst du die bisher benötigte Zeit.
Erläuterung
Das Beispiel zeigt, wie der Rahmen einer Übungsaufgabe aussehen könnte, die der Anwender innerhalb einer bestimmten Zeit absolvieren muss. Der HTML-Teil des Beispiels stellt ein vollständiges HTML-Dokument dar. Das einleitende
-Tag enthält drei