Los últimos tutoriales de desarrollo web
 

jQuery Mobile Selección de forma Menús


jQuery Mobile Seleccione Menús

Seleccione Menú en un Iphone:
Seleccione Menú en un Android/SGS4 dispositivo:

La <select> elemento crea una lista desplegable con varias opciones.

La <option> elementos dentro de la <select> elemento de definir las opciones disponibles en la lista:

Ejemplo

<form method="post" action="demoform.asp">
  <fieldset class="ui-field-contain">
    <label for="day">Select Day</label>
    <select name="day" id="day">
      <option value="mon">Monday</option>
      <option value="tue">Tuesday</option>
      <option value="wed">Wednesday</option>
    </select>
  </fieldset>
</form>
Inténtalo tú mismo "

Consejo: Si usted tiene una larga lista de opciones que se relacionan, utilice el <optgroup> elemento dentro de <select> :

Ejemplo

<select name="day" id="day">
  <optgroup label="Weekdays">
    <option value="mon">Monday</option>
    <option value="tue">Tuesday</option>
    <option value="wed">Wednesday</option>
  </optgroup>
  <optgroup label="Weekends">
    <option value="sat">Saturday</option>
    <option value="sun">Sunday</option>
  </optgroup>
</select>
Inténtalo tú mismo "

Personal Seleccione Menús

Las imágenes en la parte superior de esta página, muestra cómo las plataformas móviles tienen su propia forma de mostrar un menú de selección.

Si desea que el menú de selección para mostrar la misma en todos los dispositivos móviles, utilice encargo propio menú de selección de jQuery, el data-native-menu="false" atributo:

Ejemplo

<select name="day" id="day" data-native-menu="false" >
Inténtalo tú mismo "

Selección múltiple

Para seleccionar varias opciones en el menú de selección, utilice el atributo múltiple en el <select> elemento:

Ejemplo

<select name="day" id="day" multiple data-native-menu="false">
Inténtalo tú mismo "

Más ejemplos

El uso de data-role="controlgroup"
Como grupo de uno o más menús de selección.

El uso data-type="horizontal"
Cómo menús de selección de grupo horizontalmente.

El uso data-type="mini"
Cómo minify un menú de selección.

Opciones preseleccionadas
Cómo pre-seleccionar una opción.

Las selecciones emergentes
Cómo crear un menú de selección emergente.

Formas plegables
Cómo crear formas plegables.

Cambiar el icono de selección por defecto
Cómo cambiar el icono de menús de selección (por defecto es "arrow-d" ).

Cambio de la posición de icono
Cómo cambiar la posición de icono de menús de selección (por defecto es right ).