如何设置未选中的复选框 1 选中复选框 2 并设置未选中的复选框 2 使用脚本选中复选框 1 时？答案

【问题标题】：How to set unchecked checkbox 1 When checkbox 2 was checked and set unchecked checkbox 2 When checkbox 1 was checked using script?如何设置未选中的复选框 1 选中复选框 2 并设置未选中的复选框 2 使用脚本选中复选框 1 时？
【发布时间】：2014-01-31 23:27:42
【问题描述】：

如何设置未选中的复选框 1 选中复选框 2 并设置未选中的复选框 2 选中复选框 1 时

（使复选框像单选按钮一样工作。）

<input type="checkbox" id="checkbox1" name="checkbox1" value="checkbox1"/> checkbox 1 
<br>
<input type="checkbox" id="checkbox2" name="checkbox2" value="checkbox2"/> checkbox2

<script type="text/javascript">
document.getElementById('checkbox1').onchange = function() {
    document.getElementById('checkbox2').Unchecked = this.checked;

};
</script>

<script type="text/javascript">
document.getElementById('checkbox2').onchange = function() {
    document.getElementById('checkbox1').Unchecked = this.checked;

};
</script>

【问题讨论】：

"使复选框像单选按钮一样工作"。用户有一定的界面期望，改变它们通常是个坏主意。另外，为什么要使用 jQuery 标签？我没有看到。
如果用户只能在选择时使用，那么单选按钮会更合适。
我赞同 j08691 所说的话。用户希望复选框允许他们选择多个项目，而单选按钮只允许选择一个项目。改变这一点违背了相当成熟的用户体验方法。您是否有理由必须使用复选框而不能使用单选按钮/单选按钮列表？
我不使用单选按钮，因为单选按钮无法清除所有选择

标签： javascript html checkbox

【解决方案1】：

您需要使用 .checked 而不是 unchecked 并将其属性设置为 false

document.getElementById('checkbox2').checked = false;

FIDDLE

【讨论】：

但我不能全部取消？
好吧，如果你有更多的把它们添加到你的列表中，并像我的例子一样把它们的 checked = false 放在一边

【解决方案2】：

使用 jQuery -

$('input:checkbox').on('change',function(){
   if(this.checked)
     $(this).siblings('input:checkbox').prop('checked',false);
});

演示--->http://jsfiddle.net/3g67r/

【讨论】：

我可以使用 getElementById 作为目标吗？不是所有的输入：复选框？

【解决方案3】：

您最好的选择是为工作使用正确的输入类型。

复选框允许多选，而单选按钮则不允许。用户应该期望他们像那样工作，如果复选框像单选按钮一样工作，他们会感到困惑（我知道我会感到困惑。）

使用正确的输入，忘记用 javascript 覆盖功能。（别忘了，他们可能会关闭 javascript，这可能会导致您出现使用正确输入会阻止的问题）

【讨论】：