HTML DOM 輸入單選按鈕 defaultChecked 屬性

HTML DOM 輸入單選按鈕 defaultChecked 屬性檢查單選按鈕是否已經預設選中。如果單選按鈕已選中則返回 true，否則返回 false。

語法

以下是單選按鈕 defaultChecked 屬性的語法 −

radioObject.defaultChecked

示例

下面我們來看一個單選按鈕 defaultChecked 屬性的示例 −

線上演示

<!DOCTYPE html>
<html>
<body>
<h1>Input Radio defaultChecked property</h1>
<form>
FRUIT:
<input type="radio" name="fruits" id="Mango" checked>Mango
</form>
<br> <button type=”button” onclick="checkDefault()">CHECK</button>
<p id="Sample"></p>
<script>
   function checkDefault() {
      var c = document.getElementById("Mango").checked;
      document.getElementById("Sample").innerHTML = "The button default checked value is "+c;
   }
</script>
</body>
</html>

輸出

這將生成以下輸出 −

點選 CHECK 按鈕 −

在上面的示例中 −

我們首先在

內部建立了一個輸入元素，型別為 “radio”，名稱為 “fruits”，id 為 “Mango”，並且設定了 checked 屬性為 true −

<form>
FRUIT:
<input type="radio" name="fruits" id="Mango" checked>Mango
</form>

然後我們建立了一個 CHECK 按鈕，當用戶點選時，該按鈕將執行 checkDefault() 方法 −

<button type=”button” onclick="checkDefault()">CHECK</button>

checkDefault() 方法使用 getElementById() 方法獲取具有型別為單選按鈕的輸入元素。由於單選按鈕已選中，它將返回 true，我們將此值分配給變數 c。然後使用其 innerHTML 屬性在 id 為 “Sample” 的段落中顯示該值。

function checkDefault() {
   var c = document.getElementById("Mango").checked;
   document.getElementById("Sample").innerHTML = "The button default checked value is "+c;
}

更新於： 2021 年 2 月 15 日

85 次檢視

開啟你的 職業生涯

完成課程並獲得認證

開始學習
廣告