javascript - 多个复选框中的一个应始终保持未选中状态

Question

有很多关于 JavaScript 和条件检查复选框的主题，但我还没有找到符合我的情况的主题。

我的用例:我生成了多行，每行都有复选框，假设数字是n。现在用户应该只能检查其中的n-1。换句话说，当我们有 4 个复选框并且选中了 4 个复选框中的 3 个时，应禁用最后一个复选框。当仅选中 4 个中的 2 个时，所有复选框均可用。

我已经尝试过:

var $checks = $('input:checkbox').click(function (e) {
        var numChecked = $checks.filter(':checked').length;
        var lastUnchecked = $checks.prop('checked', false);

        if (numChecked = $checks.length - 1) {
            lastUnchecked.disabled = true;
        }
        else {
            //enable checkbox that was disabled before
            lastUnchecked.disabled = false;
        }
    });

但这不起作用，因为 var lastUnchecked = $checks.prop('checked', false); 返回所有复选框，而不仅仅是未选中的

Answer 1

试试这个。

逻辑:更改时，首先重新/启用所有复选框。然后根据检查的数量重新确定是否需要禁用任何内容。

var table = $('table'), cbs = $(':checkbox');
table.on('change', ':checkbox', function(evt) {
    cbs.prop('disabled', false);
    if (cbs.filter(':checked').length == cbs.length - 1) 
        cbs.not(':checked').prop('disabled', 1);
})

Fiddle .