HTML - selected 屬性

HTML selected 屬性用於標記選擇列表中的預設選項在頁面載入時已被選中。

此功能突出顯示選項列表中的預設或首選選項，使使用者互動更簡單。它被 Web 開發人員用來改善使用者體驗，並透過立即識別下拉列表中的預設選擇，使使用者更容易瀏覽和在 Web 表單和介面上做出決策。

語法

<option selected></option>

應用於

以下列出的元素允許使用 HTML selected 屬性。

元素	描述
<option>	HTML <option> 標籤用於定義由 <datalist> 標籤指定的自動完成資料的專案，或由 <select> 標籤定義的下拉列表的專案。

HTML selected 屬性示例

下面的例子將說明 HTML selected 屬性在哪裡以及如何使用這個屬性！

將選項設定為列表中已選中的選項

執行後，母語預設設定為印地語。

<!DOCTYPE html>
<html>

<head>
    <title>HTML 'selected' attribute</title>
</head>

<body>
    <h3>Example of the HTML 'selected' attribute</h3>
    <p>Choose your mother tongue:</p>
    <select>
        <option value="">--Choose your option--</option>
        <option value="" selected>Hindi</option>
        <option value="">Tamil</option>
        <option value="">Telugu</option>
    </select>
</body>

</html>

在按鈕功能中使用 selected 屬性

執行以下程式碼時，“HTML”預設選中。單擊“設定選中”按鈕後，選項將更新為“Angular”。

<!DOCTYPE html>
<html>

<head>
    <title>HTML 'selected' attribute</title>
</head>

<body>
    <h3>Example of the HTML 'selected' attribute</h3>
    <p>Select any frontend technology that you know:</p>
    <select>
        <option value="">--Choose your option--</option>
        <option value="" id='html' selected>HTML</option>
        <option value="" id='css'>CSS</option>
        <option value="" id='javascript'>JavaScript</option>
        <option value="" id='angular'>Angular</option>
        <option value="" id='react'>React</option>
    </select>
    <button onclick="Add()">Set selected</button>
    <script>
        function Add() {
         document.getElementById('angular').selected = true;
        }
    </script>
</body>

</html>

支援的瀏覽器

屬性
selected	是	是	是	是	是

html_attributes_reference.htm

列印頁面