jQuery Mobile Form Select Menu

Menú de selección de jQuery Mobile

Menú de selección en dispositivos iPhone:

Menú de selección en dispositivos Android:

El elemento <select> crea un menú desplegable con varias opciones.

El elemento <option> dentro del elemento <select> define las opciones disponibles en la lista:

Ejemplo

<form method="post" action="demoform.asp">
  <fieldset data-role="fieldcontain">
    <label for="day">Seleccione una fecha</label>
    <select name="day" id="day">
      <option value="mon">Lunes</option>
      <option value="tue">Martes</option>
      <option value="wed">Miércoles</option>
    </select>
  </fieldset>
</form>

Prueba por tu propia cuenta

Consejo:Si la lista contiene una larga serie de opciones relacionadas, utilice el elemento <optgroup> en <select>:

Ejemplo

<select name="day" id="day">
   <optgroup label="Días laborables">
    <option value="mon">Lunes</option>
    <option value="tue">Martes</option>
    <option value="wed">Miércoles</option>
   </optgroup>
   <optgroup label="Fines de semana">
    <option value="sat">Sábado</option>
    <option value="sun">Domingo</option>
   </optgroup>
</select>

Prueba por tu propia cuenta

Menú de selección personalizado

La imagen superior de esta página muestra la forma única en que se muestra el menú de selección en las plataformas móviles.

Si desea que el menú de selección aparezca con el mismo aspecto en todos los dispositivos móviles, utilice el menú de selección personalizado de jQuery, atributo data-native-menu="false":

Ejemplo

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

Prueba por tu propia cuenta

Selección múltiple

Si desea seleccionar múltiples opciones en el menú de selección, utilice la propiedad multiple en el elemento <select>:

Ejemplo

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

Prueba por tu propia cuenta

Más ejemplos

Usar data-role="controlgroup"
Cómo combinar uno o más menús de selección.
Usar data-type="horizontal"
Cómo combinar menús de selección horizontalmente.
Opción preseleccionada
Cómo preseleccionar una opción.
Formulario plegable
Cómo crear un formulario plegable.