HTML - тег <option>
Пример
Выпадающий список с четырьмя вариантами:
<label for="cars">Choose a car:</label>
<select id="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
</select>
Другие примеры «Попробуйте сами» ниже.
Определение и использование
Тег <option>
определяет параметр в списке выбора.
<option>
элементы помещаются внутри элемента <select> ,
<optgroup> или <datalist> .
Примечание . Тег <option>
можно использовать без каких-либо атрибутов, но обычно требуется атрибут value , который указывает, что отправляется на сервер при отправке формы.
Совет: Если у вас длинный список параметров, вы можете сгруппировать связанные параметры в теге <optgroup> .
Поддержка браузера
Element | |||||
---|---|---|---|---|---|
<option> | Yes | Yes | Yes | Yes | Yes |
Атрибуты
Attribute | Value | Description |
---|---|---|
disabled | disabled | Specifies that an option should be disabled |
label | text | Specifies a shorter label for an option |
selected | selected | Specifies that an option should be pre-selected when the page loads |
value | text | Specifies the value to be sent to a server |
Глобальные атрибуты
Тег <option>
также поддерживает глобальные атрибуты в HTML .
Атрибуты события
Тег <option>
также поддерживает атрибуты событий в HTML .
Дополнительные примеры
Пример
Использование <option> в элементе <datalist>:
<label for="browser">Choose your browser from the list:</label>
<input list="browsers" name="browser" id="browser">
<datalist id="browsers">
<option value="Edge">
<option value="Firefox">
<option value="Chrome">
<option value="Opera">
<option value="Safari">
</datalist>
Пример
Использование <option> в элементах <optgroup>:
<label for="cars">Choose a car:</label>
<select id="cars">
<optgroup label="Swedish Cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
</optgroup>
<optgroup label="German Cars">
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</optgroup>
</select>
Связанные страницы
Справочник по HTML DOM: объект Option
Настройки CSS по умолчанию
Никто.