HTML <option> тег

  • Предыдущая страница <optgroup>
  • Следующая страница <output>

Определение и использование

<option> тег определяет список вариантов в списке выбора.

<option> Элемент находится в <select>、<optgroup> или <datalist> внутри элемента.

Внимание:<option> Тег может использоваться без атрибутов, но обычно вам нужно значение attribute, которое указывает на содержимое, отправляемое на сервер при отправке формы.

Совет:Если у вас очень длинный список опций, вы можете использовать <optgroup> Группировка связанных опций в теге.

Дополнительная информация:

HTML DOM справочник:Option объект

实例

例子 1

包含四个选项的下拉列表：

<label for="cars">请选择一个汽车品牌：</label>
<select id="cars">
  <option value="audi">奥迪</option>
  <option value="byd">比亚迪</option>
  <option value="geely">吉利</option>
  <option value="volvo">沃尔沃</option>
</select>

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

例子 2

在 <datalist> 元素中使用 <option>：

<label for="browser">请从列表中选择您的浏览器：</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>

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

例子 3

在 <optgroup> 元素中使用 <option>：

<label for="cars">请选择一个汽车品牌：</label>
<select id="cars">
  <optgroup label="中国车">
    <option value="byd">比亚迪</option>
    <option value="geely">吉利</option>
  </optgroup>
  <optgroup label="德国车">
    <option value="mercedes">奔驰</option>
    <option value="audi">奥迪</option>
  </optgroup>
</select>

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

Свойства

Свойства Значение Описание
disabled disabled Указывает, что опция должна быть отключена.
label Текст Указывает короткое имя для опции.
selected selected Указывает, что должна быть предварительно выбрана опция при загрузке страницы.
value Текст Указывает значение, которое нужно отправить на сервер.

Глобальные свойства

<option> Этот тег также поддерживает Глобальные свойства в HTML.

Свойства событий

<option> Этот тег также поддерживает Свойства событий в HTML.

Default CSS settings

Нет.

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

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Поддержка Поддержка Поддержка Поддержка Поддержка
  • Предыдущая страница <optgroup>
  • Следующая страница <output>