如何使用 JavaScript/jQuery 取消选中单选按钮?
为了取消选中单选按钮,有很多方法可用,但我们将看到最首选的方法。
示例 1:此示例使用Javascript 选中属性取消选中单选按钮。 JavaScript Radio 选中属性用于设置或返回输入单选按钮的选中状态。此属性用于反映 HTML 选中的属性。
<!DOCTYPE html>
<html>
<head>
<title>
JavaScript | uncheck a radio button
</title>
</head>
<body style = "text-align:center;" id = "body">
<h1 style = "color:green;" >
GeeksForGeeks
</h1>
<input id = "radio" type="radio" name="GFG"
value="GeeksForGeeks" checked>GFG
<br><br>
<button onclick = "gfg_Run()">
uncheck
</button>
<p id="GFG_DOWN" style="color:green;font-size:20px;"></p>
<script>
var el_down = document.getElementById("GFG_DOWN");
function gfg_Run() {
var radioButton = document.getElementById("radio");
radioButton.checked = false;
el_down.innerHTML = "Unchecked";
}
</script>
</body>
</html>
输出:
- 在点击按钮之前:
- 点击按钮后:
示例 2:此示例使用jQuery prop() 方法取消选中单选按钮。 jQuery 中的 prop() 方法,用于设置或返回所选元素的属性和值。
<!DOCTYPE html>
<html>
<head>
<title>
JQuery | Uncheck a radio button
</title>
<script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js">
</script>
</head>
<body style = "text-align:center;" id = "body">
<h1 style = "color:green;" >
GeeksForGeeks
</h1>
<input id = "radio" type="radio" name="GFG"
value="GeeksForGeeks" checked>GFG
<br><br>
<button onclick = "gfg_Run()">
uncheck
</button>
<p id="GFG_DOWN" style="color:green;font-size:20px;"></p>
<script>
var el_down = document.getElementById("GFG_DOWN");
function gfg_Run() {
$("#radio").prop("checked", false);
el_down.innerHTML = "Unchecked";
}
</script>
</body>
</html>
输出:
- 在点击按钮之前:
- 点击按钮后: