Question

我的复选框需要以与单选按钮控件类似的方式操作。基本上当检查一个时，所有其他人都需要取消选中。如何以尽可能小的痛苦实现这一目标？

总结一下。如果选中了复选框，则必须取消选中所有其他（兄弟姐妹），而不必更改单击的一个检查状态。

我已经知道如何取消选中所有复选框，但如果我这样做，我必须首先存储已选中复选框的已选中状态，然后在取消选中所有复选框后重新应用它。我想知道是否有一种方法可以用一些花哨的jQuery选择器或其他一些方法来实现。

Answer 1

使用单选按钮。严重的是，单选按钮是有原因的。人们期望单选按钮是“1中n”选项，复选框是“0到n”选项。

无论如何，这是代码：

$('input:checkbox').click(function() {
    $(this).siblings('input:checkbox').removeAttr('checked');
});

演示：http://jsfiddle.net/ThiefMaster/AVEjt/

但请注意，只有在您确实需要允许用户取消选中所有内容时才使用它。然后它是可以接受的 - 否则单选按钮要好得多。

Answer 2

试试这个：

$(':checkbox').not( selector_for_current ).attr('checked', false);

selector_for_current是“当前的”，如果您正在回调，通常会this。

Answer 3

试试这个：

$(function() {
    $("input[type=checkbox]").click(function(){
        $(this).siblings("input[type=checkbox]:not(this)").attr("checked", "");
    });
});

请参阅example。

Answer 4

作为ThiefMaster非常好的答案的替代方案，您可以在父表单上注册该事件并捕获所有复选框，包括那些嵌套在字段集（或其他元素）中的复选框，这些复选框将使用“兄弟姐妹”错过。

$("#myform").click(function(e) {
    if ($(e.target).is("input:checkbox")) {
        $("input:checkbox", this).not(e.target).removeAttr("checked");
    }
})

演示：http://jsfiddle.net/Gs3wa/

jQuery：禁用除当前复选框之外的所有复选框

4 个答案: