HTML <option> 标签
实例
创建带有 4 个选项的选择列表:
<label for="cars">选择一辆车:</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>
亲自试一试 »
<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 属性,此属性会指示出被送往服务器的内容。
注释:请与 select 元素配合使用此标签,否则这个标签是没有意义的。
提示: 如果列表选项很多,可以使用 <optgroup> 标签对相关选项进行组合。
浏览器支持
元素 | |||||
---|---|---|---|---|---|
<option> | Yes | Yes | Yes | Yes | Yes |
属性
属性 | 值 | 描述 |
---|---|---|
disabled | disabled | 规定此选项应在首次加载时被禁用。 |
label | text | 定义当使用 <optgroup> 时所使用的标注。 |
selected | selected | 规定选项(在首次显示在列表中时)表现为选中状态。 |
value | text | 定义送往服务器的选项值。 |
全局属性
<option>
标签支持 HTML 中的全局属性。
事件属性
<option>
标签支持 HTML 中的事件属性。
更多实例
实例
在 <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>
亲自试一试 »
<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>
实例
在 <optgroup> 元素中使用 <option>:
<label for="cars">选择一辆车:</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>
亲自试一试 »
<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设置
None.