Тег <option> определяет пункты в раскрывающемся списке, определяемого тегом <select>, или пункты списка данных для автозаполнения, определяемого тегом <datalist>. Тег <option> может быть вложен в теги <select>, <datalist> или <optgroup>, который объединяет в группу элементы списка.
Тег <select> вкладывается в тег <form>, если данные списка должны быть отправлены на сервер, или когда к данным списка обращаются через скрипты.
Синтаксис
Тег <option> парный, закрывающий тег (</option>) обязателен.
Тег <option> используется, как правило, с атрибутом value, чтобы указать какое значение отправляется на сервер для дальнейшей обработки.
Пример
<!DOCTYPE html>
<html>
<head>
<title>Заголовок окна веб-страницы</title>
</head>
<body>
<form>
<select>
<option value="computers">Настольный компьютер</option>
<option value="notebook">Планшетный компьютер</option>
<option value="tablet">Портативный компьютер</option>
</select>
</form>
</body>
</html>
Результат
Пример
<!DOCTYPE html>
<html>
<head>
<title>Заголовок окна веб-страницы</title>
</head>
<body>
<p>Аэропорт вылета:</p>
<form action="action_form.php" method="get">
<input type = "text" list = "airports" name="airports">
<datalist id = "airports">
<option value = "Санкт-Петербург">
<option value = "Краснодар">
<option value = "Москва">
<option value = "Новосибирск">
</datalist>
<input type = "submit" value = "подтвердить">
</form>
</body>
</html>
В этом примере тег <option> вложен в тег <datalist>.
Результат
Атрибуты
Атрибут | Значение | Описание |
---|---|---|
disabled | disabled | Указывает, что элемент недоступен для выбора. |
label | text | Задает название пункта списка. |
selected | selected | Устанавливает, что вариант должен быть выбран по умолчанию во время загрузки страницы. |
value | text | Определяет значение, которое отправляется на сервер. |
Тег <option> поддерживает также глобальные атрибуты и атрибуты событий.
Поддержка браузера
✓ | ✓ | ✓ | ✓ | ✓ |
Практикуйте свои знания
What attributes are used for the <Option> HTML tag?
Правильный!
Неправильно!