Тег <select>

Выпадающий список
  • Категории: Потоковое содержимое, Фразовое содержимое, Интерактивное содержимое
  • Контекст:

    Где ожидается фразовое содержимое.

  • Модель:

    Ноль или более элементов <option> и <optgroup>.

Тег <select> (от англ. "select" - выбрать) предназначен для создания такого элемента формы как выпадающий список.

Сами варианты списка задаются во вложенных элементах <option>, а также могут быть сгруппированы при помощи <optgroup>.

Изначально список позволяет выбрать только один вариант, но при наличии атрибута muliple список превращается в мультисписок с возможностью выбора ноля или более вариантов.

Внешний вид выпадающего списка зависит от браузера, и частично может быть изменен через CSS.

Атрибуты

  • Глобальные атрибуты
  • autocomplete - автозаполнение элемента
  • autofocus - автоматическое фокусирование на элементе при загрузке страницы
  • disabled - заблокировать элемент
  • form - связь элемента с формой
  • multiple - разрешен ли выбор нескольких значений
  • name - имя элемента формы, используемое при отправке данных
  • required - обязательно ли поле для выбора
  • size - количество показываемых вариантов

  • Стандартный список

    Выпадающий список предполагает выбор одного из предложенных вариантов:

  • Размер списка

    Помимо этого мы можем задать атрибут size, который отвечает за число одновременно показаных вариантов списка:

  • Мультисписок

    Если ваш список предполагает выбор нескольких вариантов, можно преобразовать его в мультисписок. Для этого достаточно задать ему атрибут multiple. Имя мультисписка должно оканчиваться квадратными скобками, чтобы мы могли связать с ним несколько значений:

Поделитесь данной записью с друзьями