1. <option>標(biāo)簽應(yīng)用瀏覽器

所有瀏覽器都支持 <option> 標(biāo)簽。

2. 定義和用法

option 元素定義下拉列表中的一個(gè)選項(xiàng)（一個(gè)條目）。瀏覽器將 <option> 標(biāo)簽中的內(nèi)容作為 <select> 標(biāo)簽的菜單或是滾動(dòng)列表中的一個(gè)元素顯示。

option 元素位于 select 元素內(nèi)部。

<option> 標(biāo)簽可以在不帶有任何屬性的情況下使用，但是您通常需要使用 value 屬性，此屬性會(huì)指示出被送往服務(wù)器的內(nèi)容。

此標(biāo)簽一定要與select 元素配合使用，否則這個(gè)標(biāo)簽是沒有意義的。

如果列表選項(xiàng)很多，可以使用 <optgroup> 標(biāo)簽對(duì)相關(guān)選項(xiàng)進(jìn)行組合。

3. HTML 與 XHTML 之間的差異

在 HTML 中，<option> 沒有結(jié)束標(biāo)簽。

在 XHTML 中，<option> 必須被正確關(guān)閉。

4. 可選的屬性

<option> 標(biāo)簽支持 HTML 中的一些可以選擇的屬性。

屬性 值 描述

disabled disabled 規(guī)定某個(gè)選項(xiàng)應(yīng)該被禁用。被禁用的選項(xiàng)既不可用， 也不可點(diǎn)擊

label text 規(guī)定更短版本的選項(xiàng)。下拉列表中會(huì)顯示出所規(guī)定的更短版本。

selected selected 規(guī)定選項(xiàng)（在首次顯示在列表中時(shí)）表現(xiàn)為選中狀態(tài)。

value text 定義送往服務(wù)器的選項(xiàng)值。

Disabled

可以設(shè)置 disabled 屬性，直到滿足某些條件（比如選擇一個(gè)復(fù)選框），才恢復(fù)用戶對(duì)該選項(xiàng)的使用。然后，可以使用 JavaScript 來清除 disabled 屬性，以使選項(xiàng)變?yōu)榭捎脿顟B(tài)。

<select><option>Volvo</option><option>Saab</option><option disabled="disabled">Opel</option><option>Audi</option> </select>

4 個(gè)選項(xiàng)的下拉列表中Opel已被禁用

Label

定義當(dāng)使用 <optgroup> 時(shí)所使用的標(biāo)注。

<select><option label="Volvo">Volvo (Latin for "I roll")</option><option label="Saab">Saab (Swedish Aeroplane AB)</option> </select>

Selected

規(guī)定在頁(yè)面加載時(shí)預(yù)先選定該選項(xiàng)。被預(yù)選的選項(xiàng)會(huì)顯示在下拉列表最前面的位置。也可以在頁(yè)面加載后通過 JavaScript 設(shè)置 selected 屬性。

<select><option>Volvo</option><option selected="selected">Saab</option><option>Mercedes</option><option>Audi</option> </select>

Value

<option> 與 <option/> 之間的值是瀏覽器顯示在下拉列表中的內(nèi)容，而 value 屬性中的值是表單被提交時(shí)被發(fā)送到服務(wù)器的值。如果沒有指定 value 屬性，選項(xiàng)的值將設(shè)置為 <option> 標(biāo)簽中的內(nèi)容。

5. 全局屬性

<option> 標(biāo)簽支持 HTML 中的全局屬性。

6. 事件屬性

<option> 標(biāo)簽支持 HTML 中的事件屬性。

Window事件，keyboard事件，media事件，mouse事件，form事件

7. Start tag (<option>) not closed properly, expected '>'報(bào)錯(cuò)

一定要注意<option>標(biāo)簽的正確關(guān)閉

<option value="是">是</option>

<option value="否">否</option>

2020.5

總結(jié)

以上是生活随笔為你收集整理的设置input标签禁用_HTML option 标签的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。