HTML5-Handbuch - die neuen Features von HTML5

Absenden des Formulars nur das
output
-Element übertragen, denn die Eingabefelder für Vor- und Zuname enthalten kein
name
-Attribut.
Weitere Hinweise
Das obige Beispiel zeigt eine Verwendungsweise des
output
-Elements, wie sie in der HTML5-Spezifikation vorgeschlagen wird.
    In der Praxis auch neuerer Browser funktionierte das zum Redaktionszeitpunkt noch nicht. Deshalb hier noch eine herkömmliche Lösung, die auch mit älteren Browsern zuverlässig funktioniert, vorausgesetzt JavaScript ist aktiviert.
Beispiel
    
    

    onsubmit="zuvorname(); return true;">
    
    

Vorname Zuname:
    
    
    

    
    

    Bei dieser Lösung wird die Zusammensetzung der Zeichenkette in einer eigenen JavaScript-Funktion vorgenommen. Diese wird aufgerufen, wenn das Formular abgesendet wird (Event-Handler
onsubmit
im einleitenden

-Tag). Der zusammengesetzte Wert ( Zuname, Vorname ) wird in einem versteckten Formularfeld gespeichert.
Die HTML5-Spezifikation machte zum Redaktionszeitpunkt keine Aussage darüber, wie ein Browser ein
output
-Feld darstellen soll, d. h. ob es zum Beispiel wie ein Nur-Lesen-Eingabefeld erscheinen soll oder etwa als reiner Text.
Referenzinformationen
    Elementreferenz

:
    Attributreferenz
for
:
    Eventreferenz:
onforminput
:

8.5.2      Fortschrittsanzeige
HTML5 führt ein neues Element namens
progress
ein, das verwendet werden kann, um Fortschrittsanzeigen bei länger dauernden Prozessen zu realisieren.
    Die Art, wie dieses neue Element in Browsern dargestellt werden soll, war zum Redaktionszeitpunkt jedoch noch nicht abschließend geklärt. Momentan wird es als Fortschrittsbalken, wie man ihn von einer Softwareinstallation kennt, dargestellt.
Beispiel
    
    

    

Dein Name:
    
    

    

Schritt 1 / 4

    

    

    

    

Deine Hobbies:
    
    

    

Schritt 2 / 4

    

    

    

    

Dein größter Wunsch:
    
    

    

Schritt 3 / 4

    

    

    

    

Dein größter Erfolg:
    
    

    

Schritt 4 / 4

    
    

    
    
Erläuterung
    Das obige Beispiel realisiert mit Hilfe von etwas CSS und einem kleinen JavaScript ein Formular, das dem Anwender in Form mehrerer Einzelschritte präsentiert wird. Auf die dabei verwendeten Techniken wird an dieser Stelle nicht näher eingegangen. Zur Anzeige der einzelnen Schritte wird das
progress
-Element verwendet.
    Bild 8.20: Das zweite von vier Fieldsets mit Fortschrittsbalken im Browser
    Das
progress
-Element erhält üblicherweise zwei Attribute: Mit dem Attribut
max
wird ein numerischer Zielwert vorgegeben, und das Attribut
value
enthält den aktuellen Wert, so wie im obigen Beispiel etwa bei
Schritt 1 /4
. Der Elementinhalt ist unabhängig von den Attributwerten. Er kann aus Text und