資料結構
網路
關係資料庫管理系統 (RDBMS)
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C語言程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
服裝設計
法學如何使用 JavaScript 停用單選按鈕？
單選按鈕是一種輸入型別，以選項的形式接收輸入。使用者將從多個選項中選擇一個值。在多個可能的選項中，只能選擇一個。
在本文中，我們將探討如何停用單選按鈕以及如何在需要時重新啟用它。我們將瞭解單選按鈕的內部工作原理以及如何在需要時停用它們。
大多數情況下，單選按鈕僅在某些情況下作為確認的一部分顯示給使用者。不需要時，我們可以停用它們，以免使用者選擇選項。
方法
在這種方法中，我們將使用 HTML 提供的 `disabled` 屬性。此屬性允許您停用任何 HTML 元素。這是一個布林值屬性，只有兩個值，即 `true` 或 `false`。使用 `disabled` 時，它會停用該特定的 HTML 元素。`disabled` 的預設值為 `false`。
示例
在下面的示例中，我們將一個字串與正則表示式進行比較，如果字串匹配則返回其索引。如果不匹配，則返回 -1。
# index.html
<!DOCTYPE html>
<html lang="en">
<head>
<!-- CSS code required for the page -->
<style>
#submit {
width: 30%;
margin: 20px;
height: 40px;
border-radius: 20px;
color: black;
font-size: 1rem;
font-weight: bold;
border: 1px solid black;
cursor: pointer;
}
#submit:hover {
background-color: grey;
color: rgb(0, 0, 0);
}
</style>
</head>
<body>
<div>
<h1 style="color: green;">Welcome To Tutorials Point</h1>
<h2>Do you like sports ?</h2>
<div class="question1">
<label><input name="sport" type="radio" id="yes" value="yes"/> Yes</label>
<label><input name="sport" type="radio" id="no" value="no" onchange="check()" /> No</label>
</div>
<h2>
If No, Choose your favourite sport.
</h2>
<div class="question2">
<label><input type="radio" name="sports" id="cricket" value="Cricket" />Cricket</label>
<label><input type="radio" name="sports" id="football" value="Football" />Football</label>
<label><input type="radio" name="sports" id="basketball" value="Basket Ball" />Basket Ball</label>
<label><input type="radio" name="sports" id="others" value="Others" /> Others</label>
</div>
<button id="submit" onclick="message()">
Submit
</button>
</div>
<script>
// This function will check if the user has
// selected any option from the question 1
function check() {
if (document.getElementById('no').checked) {
document.getElementById('cricket').disabled = true;
document.getElementById('football').disabled = true;
document.getElementById('basketball').disabled = true;
document.getElementById('others').disabled = true;
}
}
// This function will give the message after
// the user clicks on the submit button.
function message() {
if (document.getElementById('yes').checked) {
if (document.getElementById('cricket').checked) {
alert("You like Cricket.");
}
else if
(document.getElementById('football').checked) {
alert("You like Football.");
}
else if
(document.getElementById('basketball').checked) {
alert("You like Basket Ball.");
}
else if
(document.getElementById('others').checked) {
alert("You like Other sports.");
}
} else {
alert("You donot like sports");
}
}
</script>
</body>
</html>輸出
對於問題“你喜歡運動嗎？”，如果您選擇“是”，則單選按鈕不會被停用；但如果您選擇“否”，則單選按鈕會被停用。
更新於：2022年4月26日
2K+ 次瀏覽
廣告