jQuery Mobile Form Select Menu

jQuery Mobile Auswahlmenü

Auswahlmenü auf iPhones:

Auswahlmenü auf Android-Geräten:

Das <select>-Element erstellt ein Dropdown-Menü mit mehreren Optionen.

Die <option>-Elemente im <select>-Element definieren die verfügbaren Optionen in der Liste:

Beispiel

<form method="post" action="demoform.asp">
  <fieldset data-role="fieldcontain">
    <label for="day">Wählen Sie ein Datum</label>
    <select name="day" id="day">
      <option value="mon">Montag</option>
      <option value="tue">Dienstag</option>
      <option value="wed">Mittwoch</option>
    </select>
  </fieldset>
</form>

Probieren Sie es selbst aus

Hinweis:Wenn die Liste eine lange Reihe relevanter Optionen enthält, verwenden Sie das <optgroup>-Element im <select>-Element:

Beispiel

<select name="day" id="day">
   <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>

Probieren Sie es selbst aus

Benutzerdefiniertes Auswahlmenü

Das Bild oben auf dieser Seite zeigt die einzigartige Art und Weise, wie Auswahlmenüs auf mobilen Plattformen angezeigt werden.

Wenn Sie möchten, dass das Auswahlmenü auf allen mobilen Geräten einheitlich aussieht, verwenden Sie das jQuery-benutzerdefinierte Auswahlmenü, das Attribut data-native-menu="false":

Beispiel

<select name="day" id="day" data-native-menu="false">

Probieren Sie es selbst aus

Mehrfachauswahl

Wenn Sie mehrere Optionen im Auswahlmenü auswählen möchten, verwenden Sie das Attribut "multiple" im <select>-Element:

Beispiel

<select name="day" id="day" multiple data-native-menu="false">

Probieren Sie es selbst aus

Mehr Beispiele

Verwenden Sie data-role="controlgroup"
Wie man eine oder mehrere Auswahlmenüs kombiniert.
Verwenden Sie data-type="horizontal"
Wie man Auswahlmenüs horizontal kombiniert.
Vorausgewählte Optionen
Wie man eine Option vorauswählt.
Faltbare Formulare
Wie man faltbare Formulare erstellt.