jQuery Mobile Formular-Auswahlmenü
jQuery Mobile Auswahlmenü
Das <select>-Element erstellt eine Dropdown-Liste mit mehreren Optionen.
Die <option>-Elemente innerhalb des <select>-Elements definieren die verfügbaren Optionen in der Liste:
Beispiel
<fieldset class="ui-field-contain">
<label for="day">Tag auswählen</label>
<select name="day" id="day">
<option value="mon">Montag</option>
<option value="tue">Dienstag</option>
<option value="wed">Mittwoch</option>
</select>
</fieldset>
</form>
Selbst ausprobieren »
Tipp:Wenn du eine sehr lange Liste verwandter Optionen hast, verwende das <optgroup>-Element innerhalb des <select>:
Beispiel
<optgroup label="Wochentage">
<option value="mon">Montag</option>
<option value="tue">Dienstag</option>
<option value="wed">Mittwoch</option>
</optgroup>
<optgroup label="Wochenenden">
<option value="sat">Samstag</option>
<option value="sun">Sonntag</option>
</optgroup>
</select>
Selbst ausprobieren »
Benutzerdefiniertes Auswahlmenü
Die Bilder oben auf dieser Seite zeigen, wie ein Auswahlmenü auf mobilen Plattformen dargestellt wird.
Wenn Sie möchten, dass das Auswahlmenü auf allen mobilen Geräten gleich angezeigt wird, verwenden Sie das in jQuery integrierte benutzerdefinierte Auswahlmenü mit dem Attribut data-native-menu="false":
Mehrfachauswahl
Um mehrere Optionen in einem Auswahlmenü auszuwählen, verwenden Sie das Attribut multiple im <select>-Element:
Weitere Beispiele
Wie man ein oder mehrere Auswahlmenüs kombiniert.
So kombinieren Sie Auswahlmenüs horizontal.
So wählen Sie eine Option vorab aus.
So verkleinern Sie ein Auswahlmenü.
So erstellen Sie ein Popup-Auswahlmenü.
So erstellen Sie ein einklappbares Formular.
So ändern Sie das Symbol des Auswahlmenüs (Standard ist "arrow-d").
Wie man die Position des Icons ändert (standardmäßig rechts).