HTML5-Handbuch - die neuen Features von HTML5

method="post">
    

    Pizzas:

    
    Pizza Napoli
    Pizza mit Salami
    Pizza mit Pilzen
    
    Pizza mit Kapern und Oliven
    
    Pizza mit Meeresfrüchten
    Gefüllte Pizza
    
    
    

    

    Weitere Zutaten:

    (Mehrfachauswahl möglich)

    
    Schinken
    Peperoni
    Paprika
    Artischocken
    Schafskäse
    
    
    

    

    Wein:

    
    
    Valpolicella
    Chianti
    Montepulciano
    
    
    Soave
    Frascati
    Trentino
    
    
    
    

    
Erläuterung
    Im Beispiel werden insgesamt drei Auswahllisten definiert:
•   Im ersten Beispiel wird eine Liste gezeigt, bei der nur ein Element sichtbar ist. Der erste Listeneintrag ist vorausgewählt.
•   Im zweiten Beispiel wird eine Liste mit mehreren sichtbaren Einträgen gezeigt. Die Liste erlaubt es, mehrere Einträge auszuwählen.
•   Das dritte Beispiel zeigt eine Liste mit gruppierten Einträgen.
    Eine Auswahlliste wird durch

…

markiert.
    Mit

…

definieren Sie zwischen dem einleitenden

-Tag und dem Abschluss-Tag

jeweils einen Eintrag der Auswahlliste. Zwischen

und

steht der im Browser angezeigte Text des Listeneintrags. Sie können so viele Listeneinträge definieren, wie Sie wollen.
    Wenn Sie Einträge, wie im dritten Beispiel gezeigt, gruppieren möchten, schließen Sie die
option
-Elemente einer Gruppe in
…
ein. Das
label
-Attribut enthält die Beschriftung der Gruppe.
    Bild 8.6: Auswahllisten im Browser
    Auswahllisten sollten wie alle Formularelemente ein
name
-Attribut erhalten. Notieren Sie das Attribut im einleitenden

-Tag und vergeben Sie einen geeigneten Namen. Die zugehörigen möglichen Werte notieren Sie in den einleitenden

-Tags der Auswahlliste mit Hilfe von
value
-Attributen. Auf diese Weise wird am Ende ein Name-Wert-Paar wie pizza = napoli übertragen. Sie können übrigens auch auf die
value
-Attribute verzichten. In diesem Fall wird der Elementinhalt ausgewählter
option
-Elemente übertragen, also der Text, der im Browser als Auswahleintrag angezeigt wird.
    Wenn Sie nichts anderes angeben, ist zunächst kein Eintrag einer Auswahlliste vorselektiert. Um einen Eintrag der Auswahlliste vorzuselektieren, geben Sie im einleitenden

-Tag des betreffenden Eintrags das Standalone-Attribut
selected
an, so wie in der ersten der obigen Beispiellisten bei
Pizza Napoli
.
    Wenn Sie nichts anderes angeben, kann der Anwender aus einer Auswahlliste genau einen Eintrag auswählen. Die Mehrfachauswahl einer Auswahlliste erlauben Sie durch das zusätzliche Standalone-Attribut
multiple
im einleitenden

-Tag.
    Beachten Sie, dass eine Mehrfachauswahl für Anwender nicht unmittelbar erkennbar ist. Deshalb sollten Sie darauf hinweisen, wenn mehrere Einträge auswählbar sind. Auch ist nicht allen Anwendern klar, wie sie mehrere Einträge selektieren können. Auf modernen PC-Tastaturen geschieht das normalerweise durch Halten der [Strg]-Taste bei gleichzeitigem Anklicken der gewünschten Listeneinträge. Apple-Benutzer verwenden dafür die Befehlstaste.
    Mit dem Attribut
size
bestimmen Sie die Anzeigegröße der Liste, d. h. wie viele Einträge sichtbar angezeigt werden sollen. Wenn die Liste mehr Einträge enthält, als angezeigt werden, kann der Anwender in der Liste scrollen. Wenn Sie
size="1"
angeben, sowie in der ersten der obigen Beispiellisten, definieren Sie eine sogenannte »Dropdown-Liste«.
Weitere Hinweise
    Bei Mehrfachauswahl werden die ausgewählten Beiträge, wenn das Formular an ein serverseitiges Script