Описание тега html-select

Выбор (<select>) HTML-элемент представляет собой элемент управления пользовательского интерфейса, который представляет собой меню параметров. Параметры в меню представлены<option> элементы, представленные значения которых определяются его value атрибут.

<select name="myselect">
  <option value="some-text">Some Text</option>
</select>

Одно или несколько меню выбора

Меню с одним выбором - это меню по умолчанию, в которых вы найдете гораздо больше возможностей. Пользователям разрешено выбирать только один вариант из раскрывающегося списка. Размер элемента управления также может быть изменен для размещения более длинного меню, которое прокручивает параметры, а не создает раскрывающееся меню. Каждый раз, когда используется размер 2 или больше, меню становится прокручиваемым полем. Указанный размер будет включать это количество опций в видимой области меню выбора (поэтому при определении размера 4 будут отображаться 4 варианта в высоту с полосой прокрутки). Чтобы установить размер, просто добавьтеsize="4" к <select> элемент, указав любой желаемый размер.

Меню с множественным выбором всегда должно иметь размер не менее 2, поскольку указание его размера на 1 вызовет проблемы с отображением в браузере (при этом не будет создаваться полоса прокрутки). Поскольку можно выбрать несколько опций, в этих меню нельзя использовать раскрывающееся меню. По умолчанию, когда меню выбора превращается в меню с множественным выбором, оно наследует размер 4.

Синтаксис для множественного выбора

<select multiple="multiple">...</select>

Примечание. Хотя большинство браузеров по-прежнему будут правильно отображать меню, используя толькоmultiple, это считается недопустимым синтаксисом, и вы всегда должны использовать полныйmultiple="multiple"формат при установке в меню множественного выбора. В этом атрибуте нет другого допустимого значения (например, "single").

Скрипты с множественным выбором и серверные скрипты

При отправке меню с множественным выбором в серверный скрипт через POST или GET вы заметите, что некоторые серверные языки не будут анализировать все выбранные значения (если их больше одного) и создавать массив. Вместо этого он предоставит вам только последний вариант, выбранный в меню. Чтобы исправить это, мы можем изменить имя меню выбора, чтобы учесть все параметры, поместив их в массив, указав[]в конце. Это будет работать для большинства языков программирования, включая PHP.

<select multiple="multiple" name="myselect[]">...</select>

Предварительный выбор варианта

Предварительный выбор удобен для предоставления параметра по умолчанию, который выберет средний пользователь или который система рекомендует использовать (например, параметр конфиденциальности). По умолчанию можно выбрать любой вариант. При использовании с меню с множественным выбором по умолчанию можно выбрать любое количество параметров. Однако при использовании с меню с одним выбором последний параметр, который установлен как выбранный, будет отображаться как выбранный при отображении в браузере. Если ни один параметр не установлен для выбора в меню с одним выбором, по умолчанию будет выбран первый вариант в меню. Обычно этот параметр оставляется пустым, чтобы серверные сценарии могли легко определить, выбрал ли что-либо пользователь.

Синтаксис предварительного выбора

<option value="some-text" selected="selected">Some Text</option>

Примечание. Хотя большинство браузеров по-прежнему будут правильно отображать меню, используя толькоselected, это считается недопустимым синтаксисом, и вы всегда должны использовать полныйselected="selected"формат при предварительном выборе параметра. Нет другого допустимого значения (например, "нет" или "невыбранный"), которое может присутствовать внутри этого атрибута.

Группирование вариантов вместе

Вы можете дополнительно организовать свои варианты по "категориям", используя <optgroup>element, который (как вы могли догадаться) группирует параметры в нем под определенным заголовком. Этот заголовок отображается в несколько ином стиле над группой параметров, которые он представляет, и не может быть выбран пользователем (может только параметр). Кроме того, то, что некоторые параметры находятся в группе параметров, не означает, что все параметры должны быть внутри одной. Используемый заголовок определяется егоlabelатрибут. Например:

<optgroup label="Apples">
    <option value="granny-smith">Granny Smith</option>
    <option value="red-delicious">Red Delicious</option>
</optgroup>
<option value="bananas">Bananas</option>

Поддержка браузера

В <select> Тег поддерживается всеми браузерами.