jQuery:make复选框就像单选按钮一样？

Question

有没有办法让复选框像单选按钮一样？我假设这可以用jQuery完成？

<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][]" />

<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][]" />

如果选中了一个框,则该组中的其他框将取消选中.

Answer 1

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

这样做,虽然我同意这可能是一个坏主意.

在线示例:http://jsfiddle.net/m5EuS/1/

UPDATE添加了组分离.

Answer 2

更新Jquery 1.9- 使用.prop()而不是.attr()

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

这是一个例子:http: //jsfiddle.net/m5EuS/585/

Answer 3

如果将类应用于复选框，则可以使用以下代码轻松实现单选按钮功能：

$(".make_radio").click(function(){
    $(".make_radio").not(this).attr("checked",false); 
});