Question

我需要具有一种质量的单选按钮的复选框列表：

你只能检查其中一个。

我不想使用单选按钮，因为我需要其他品质的复选框，比如你可以通过额外的点击取消检查。

有没有简单的方法呢？

我可以使用javascript，包括knockout和jquery库。

Answer 1

HTML：

<fieldset>
    <legend>Group1</legend>
       <input type="checkbox" class="radio" value="1" name="fooby[1][]" />
       <input type="checkbox" class="radio" value="1" name="fooby[1][]" />
       <input type="checkbox" class="radio" value="1" name="fooby[1][]" />
  </fieldset>
<fieldset>
    <legend>Group2</legend>
       <input type="checkbox" class="radio" value="1" name="fooby[2][]" />
       <input type="checkbox" class="radio" value="1" name="fooby[2][]" />
       <input type="checkbox" class="radio" value="1" name="fooby[2][]" />
</fieldset>

复选框组与单选按钮组完全相同

<强>的jsfiddle： Checkbox Group

Javascript：

$("input:checkbox").click(function(){
    var group = "input:checkbox[name='"+$(this).attr("name")+"']";
    $(group).attr("checked",false);
    $(this).attr("checked",true);
});

复选框组您可以删除所有选中的内容。

的jsfiddle： Checkbox Group(can remove all checked)

Javascript：

$("input:checkbox").change(function(){
    var group = "input:checkbox[name='"+$(this).attr("name")+"']";    
    $(group).not(this).prop("checked",false);
    $(this).prop("checked",!this.checked);      
});

Answer 2

DEMO

$(function() {
    $(':checkbox').on('change',function() {
        $(':checkbox[name=' + this.name + ']:checked').not(this).prop('checked',false);
    });
});

带有收音机按钮质量的复选框

2 个答案: