HTML - Element: <select>
Mit dem <select>-Tag erstellen Sie eine Auswahlliste für Formulare. Einen Listeneintrag fügen Sie mit dem <option>-Tag ein.
<!DOCTYPE html> <html> <head> <title>Auswahlliste</title> </head> <body> <h1>Auswahlliste</h1> <form action=""> Ihre Wahl: <select name="" size="1"> <option>Auswahl 1</option> <option>Auswahl 2</option> <option>Auswahl 3</option> <option>Auswahl 4</option> <option>Auswahl 5</option> </select> </form> </body> </html>
Attribute
name="" - Bezeichnername für den <select>-Tag.
size="" - Anzeigegröße der Liste für den <select>-Tag
multiple="multiple" - Mehrfach-Auswahl für den <select>-Tag
value="" - Absendewert für den <option>-Tag
selected="selected" - Ausgewählte Option für den <option>-Tag.
disabled="disabled" - Ausgeschaltete Auswahlliste oder <option>-Tag.
<!DOCTYPE html> <html> <head> <title>Auswahlliste mit Mehrfach-Auswahl</title> </head> <body> <h1>Auswahlliste mit Mehrfach-Auswahl</h1> <p>Die 3 Option wurde vorausgewählt.</p> <form action=""> Ihre Wahl: <br> <select name="" size="5" multiple="multiple"> <option value="1">Auswahl 1</option> <option value="2">Auswahl 2</option> <option value="3" selected="selected">Auswahl 3</option> <option value="4">Auswahl 4</option> <option value="5" disabled="disabled">Auswahl 5</option> </select> </form> </body> </html>
Optionen gruppieren
Mit dem <optgroup>-Tag (optgroup = Optionsgruppe) kann man Optionen gruppieren (zusammenfassen). Mit dem label="" Attribut wird eine Gruppenüberschrift hinzugefügt.
<!DOCTYPE html> <html> <head> <title>Optionen der Auswahlliste gruppieren</title> </head> <body> <h1>Optionen der Auswahlliste gruppieren</h1> <form action=""> Ihre Wahl: <br> <select size="12"> <optgroup label="Gruppe 1"> <option>Auswahl 1</option> <option>Auswahl 2</option> <option>Auswahl 3</option> <option>Auswahl 4</option> <option>Auswahl 5</option> </optgroup> <optgroup label="Gruppe 2"> <option>Auswahl 6</option> <option>Auswahl 7</option> <option>Auswahl 8</option> <option>Auswahl 9</option> <option>Auswahl 10</option> </optgroup> </select> </form> </body> </html>
Bausteine Alle Anzeigen
Eine zufällige Auswahl von Codeschnipseln
aus den Bereichen
HTML, CSS,
PHP, JavaScript und
MySQL.
<pre> Präformatierter Text
PHP - Nächstgrößeren Zehner finden
JavaScript - HTML-Tags in benannte Zeichen umwandeln
MySQL - Das Datum und die Uhrzeit der letzten 30 Minuten anzeigen