jQuery - 取消选中与单选按钮相似的复选框

Question

我有以下jQuery代码使我的复选框像单选按钮一样,所以一次只能检查3个中的1个.

<script type="text/javascript" language="javascript">
$(document).ready(function() {
    $("#testing input:checkbox").change(function(){
        var checkname = $(this).attr("name");
        $("input:checkbox[name='" + checkname + "']").removeAttr("checked");
        this.checked = true;
    });
});
</script>

复选框的布局如下:

<input type="checkbox" id="testing" name="testing" value="B">
<input type="checkbox" id="testing" name="testing" value="I">
<input type="checkbox" id="testing" name="testing" value="A">

这正是我想要它工作的方式,而不是一个问题,除了一旦我点击其中一个,我无法取消它以便它们都没有被检查,这就是我想要发生的事情,因此只有能够一次单击一个,我可以完全取消选中它们.

任何帮助都会很棒:)

Answer 1

只有运行取消选中其他人如果代码this已checked.

示例: http ://jsfiddle.net/CX5Th/1/

$("#testing input:checkbox").change(function() {
    if( this.checked ) {
        var checkname = $(this).attr("name");
        $("input:checkbox[name='" + checkname + "']").removeAttr("checked");
        this.checked = true;
    }
});

编辑:这是一个修订版,可以防止在选中具有相同名称的框时取消选中新选中的框.它使用not()^(docs)排除当前复选框.

示例: http ://jsfiddle.net/CX5Th/2/

$("#testing input:checkbox").change(function() {
    if (this.checked) {
        var checkname = $(this).attr("name");
        $("input:checkbox[name='" + checkname + "']").not(this).removeAttr("checked");
    }
});