使单选按钮“可检查”：HTML

Question

如何使单选按钮的操作更像复选框？我需要单选按钮的功能，但需要能够取消选择它。

Answer 1

通常这是通过添加另一个选项“无”来完成的。用户不会期望单击选定的单选按钮会取消选择它，因为这不是正常行为。

另一个不再经常使用的选项是“清除”按钮。但我不喜欢这个选项。

Answer 2

您可以创建一个“无”选项，或者创建一个 JavaScript 按钮来取消选择每个单选按钮。我想知道如果单选按钮已经被选中，它的 onclick 事件是否会做出反应......

Answer 3

您可以向每个单选按钮添加一个 onClick 函数，如果在选择时单击该单选按钮，该函数将取消选择它（尚未尝试过，但似乎合理）。不过，对于大多数用户来说，这确实是意想不到的行为 - 我认为建议“无”选项的其他答案更好。

编辑：只是为了好玩，我尝试了一下。有用。我的代码非常俗气 - 只是为了快速测试而完成的。

<script>
  var x = false;
</script>

<input type="radio" value="test 1" name="1" onmousedown="if (this.checked) { x = true; }" onclick="if (x) {this.checked = false; x = false; return true;}" />1
<input type="radio" value="test 2" name="1" onmousedown="if (this.checked) { x = true; }" onclick="if (x) {this.checked = false; x = false; return true;}" />2
<input type="radio" value="test 3" name="1" onmousedown="if (this.checked) { x = true; }" onclick="if (x) {this.checked = false; x = false; return true;}" />3

Answer 4

您可以按照其他人的建议使用“无”选项。如果这是不可接受的，您的其他选项是：

1. 选中具有逻辑的复选框以仅接受一个选择。
2. 只允许单个选择的列表框。