如何設定HTML 'select' 元素的預設值?
要設定HTML <select> 元素的預設值,我們可以使用HTML 的selected 屬性。當您想在下拉選單中顯示預定義值時,可以使用此屬性。
在本文中,我們有一個包含四個選項的下拉列表,我們的任務是設定HTML HTML select 元素的預設值。
設定select元素預設值的步驟
我們將遵循以下步驟來設定HTML select 元素的預設值
- 我們使用select標籤建立了一個下拉列表,然後使用 option 標籤向列表中添加了選項。
- 我們在希望將其設定為下拉列表預設值的選項上使用了selected 屬性。
- 我們還使用了disabled 和 hidden 屬性。disabled屬性阻止選擇該選項,hidden屬性則隱藏該選項。當您想顯示說明但不想將其包含在選項中時,這很有用。
示例
這是一個完整的示例程式碼,它實現了上述步驟,使用selected 屬性設定HTML <select> 元素的預設值。
<!DOCTYPE html>
<html>
<body>
<h3>
To set the default value for an
HTML select element
</h3>
<p>
In this example we have used HTML
<strong>selected</strong> attribute
to set the default value for HTML
select element.
</p>
<select name="courses">
<option value="none" selected disabled hidden>
Choose any option...
</option>
<option value="Java">Java</option>
<option value="Discrete Mathematics">
Discrete Mathematics
</option>
<option value="Chemistry">Chemistry</option>
<option value="IOT">IOT</option>
</select>
</body>
</html>
結論
在本文中,我們討論瞭如何使用selected 屬性設定HTML <select> 元素的預設值。
廣告
資料結構
網路
關係資料庫管理系統 (RDBMS)
作業系統
Java
iOS
HTML
CSS
Android
Python
C語言程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP