Меню Выбора Формы jQuery Mobile

Для создания меню выбора в формах jQuery Mobile используются элементы select и option.

Меню Выбора jQuery Mobile

Элемент <select> создает выпадающий список с несколькими опциями.

Элементы <option> в элементе <select> определяют доступные опции в списке:

Пример

<form method="post" action="demoform.php">
  <fieldset data-role="fieldcontain">
    <label for="day">Выберите День</label>
    <select name="day" id="day">
      <option value="mon">Понедельник</option>
      <option value="tue">Вторник</option>
      <option value="wed">Среда</option>
    </select>
  </fieldset>
</form>

Попробуйте сами »

Подсказка: Если у Вас есть длинный список опций, которые связаны друг с другом, используйте элемент <optgroup> внутри <select>:

Пример

<select name="day" id="day">
   <optgroup label="Выходные">
    <option value="mon">Понедельник</option>
    <option value="tue">Вторник</option>
    <option value="wed">Среда</option>
  </optgroup>
  <optgroup label="Выходные">
    <option value="sat">Суббота</option>
    <option value="sun">Воскресенье</option>
  </optgroup>
</select>

Попробуйте сами »

Пользовательские Меню Выбора

Изображения сверху этой страницы показывают, какой у мобильных платформ есть свой собственный способ показывать меню выбора.

Если Вы хотите, чтобы меню выбора выводило на экран то же самое на всех мобильных устройствах, используйте собственное меню выбора jQuery, атрибут data-native-menu="false":

Пример

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

Попробуйте сами »

Множественные выборы

Чтобы выбрать несколько опций в меню выбора, используйте атрибут multiple в элементе <select>:

Пример

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

Попробуйте сами »

Еще примеры

Использование data-role="controlgroup"
Как сгруппировать одно или больше меню выбора.

Использование data-type="horizontal"
Как сгруппировать меню выбора горизонтально.

Выбранные заранее опции
Как заранее выбрать опцию.

Складные формы
Как создать складные формы.

Далее: События Прокрутки jQuery Mobile

Смотрите также
Комментарии
Написать

(обязательно)

(обязательно)

Это не спам (обязательно)