使用 javascript 和 html 选中/取消选中单选按钮

Question

请指教，如何使用javascript取消选中单选按钮？ 我已经检查过类似的问题，但无法弄清楚。

 function uncheck1(){ let chkstatus = document.getElementById("radiobtn1").checked; if (chkstatus==true) { document.getElementById("radiobtn1").checked = false; } else if (chkstatus==false){ document.getElementById("radiobtn1").checked = true; } }

 <input onclick="uncheck1()" id="radiobtn1" name="grp1" type="radio" value="prashant">prashant</input>

单击后，条件为真，脚本将值设置为假，因此根本没有选择值。 请告知具体需要修改的地方？

Answer 1

当您单击单选按钮时， onClick事件将始终认为单选已选中，因为这就是单选的工作方式。 相反，使用第二个 var 来跟踪打开状态，然后相应地设置状态....

 var checked = false; function uncheck1(){ if(checked) { document.getElementById("radiobtn1").checked = false; checked = false; return; } checked = true; }

 <input onclick="uncheck1()" id="radiobtn1" name="grp1" type="radio" value="prashant">prashant</input>

我现在可以点击收音机，看到它被选中，再次点击它，看到它被取消选中。

Answer 2

添加一个按钮来切换单选按钮。 你会看到它确实有效。

  <input type="button" onclick="uncheck1()" />

这是因为您正在切换单选按钮 onclick 并使用该功能再次执行相同的操作。 因此，实际上您要两次切换选中状态。

最终代码：

<input id="radiobtn1" name="grp1" type="radio" value="prashant" /> <label for="radiobtn1">prashant</label>

<input type="button" onclick="uncheck1()" />

从收音机中删除了 onclick 并添加了适当的标签以使收音机按预期工作。