javascript - 至少检查复选框组中的复选框(!)

Question

我正在寻找一种方法来在一组复选框中至少选中一个复选框。我唯一能找到的是验证是否至少选中一个复选框的方法，但是您始终能够选中/取消选中最后一个复选框 - 有没有一种方法可以确保当用户单击复选框时至少有一个复选框必须保持选中状态(并且只有在至少选中两个复选框时才可以取消选中其中一个)？

感谢您的帮助!电压

Answer 1

复选框的值会“改变”，所以最好听一下。请记住，“单击”仅处理鼠标单击，因此仍然可以使用 Enter 或空格键更改值。为了可访问性，我会坚持使用 onchange。

Fiddle

Updated Fiddle

js

$(function () {
    $('.cbClassSegments').on('change', function (e) {
            
        !$(this).siblings(':checked').length &&
            $(this).prop('checked', true) &&
                e.preventDefault();

        // move assignment down and prevent default action 
        cbObjSegments[this.id] = this.checked;
        console.log(valuesTrueInObject(cbObjSegments));
 
    })
})

html

<input type="checkbox" value="1" checked>
<input type="checkbox" value="1">
<input type="checkbox" value="1">