如何使用JavaScript/jQuery取消选择单选按钮
为了取消选择单选按钮,有很多方法可用,但我们将看到最常用的方法。在HTML中,我们可以使用相同的name属性创建单选按钮,并为每个单选按钮设置唯一的值。每组中只能选择一个单选按钮。
取消选择单选按钮的方法:
- Javascript checked属性
- jQuery prop()方法
示例1: 这个示例使用 Javascript checked属性 取消选择 单选按钮 。JavaScript的Radio checked属性用于设置或返回输入单选按钮的选中状态。这个属性用于反映HTML checked属性。
<!DOCTYPE html>
<html lang="en">
<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>
let el_down = document.getElementById("GFG_DOWN");
function gfg_Run() {
let radioButton = document.getElementById("radio");
radioButton.checked = false;
el_down.innerHTML = "Unchecked";
}
</script>
</body>
</html>
输出:

示例2: 此示例使用jQuery的prop()方法取消选中 单选按钮 。prop()方法用于设置或返回所选元素的属性和值。
<!DOCTYPE html>
<html lang="en">
<body>
<script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js">
</script>
<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>
let el_down = document.getElementById("GFG_DOWN");
function gfg_Run() {
$("#radio").prop("checked", false);
el_down.innerHTML = "Unchecked";
}
</script>
</body>
</html>
输出:

极客教程