检查复选框组是否被选中但未被禁用

Check if group of checkboxes are checked but not disabled

此代码:

if ($('[id*="cat' + cat_id + '_sk"]').is(':checked') && $('[id*="cat' + cat_id + '_sk"]').not(':disabled')) {
        $('[id*="cat' + cat_id + '_sk"]').prop('checked', false);
} else if ($('[id*="cat' + cat_id + '_sk"]').not(':checked') && $('[id*="cat' + cat_id + '_sk"]').not(':disabled')) {
        $('[id*="cat' + cat_id + '_sk"]').prop('checked', 'checked');
}   

似乎忽略了if子句的第二部分;如果复选框被选中,我希望它被忽略。

我也尝试过 is(':disabled) 和前面的 !,也尝试过 boolean !(element).prop('disabled'); - 都是一样的效果。

肯定会调用上面的代码,因为所有复选框都会切换选中状态——问题围绕无法忽略禁用的复选框展开。

我的逻辑错了吗?

您应该使用 !obj.is(':checked')),例如:

if ($('[id*="cat' + cat_id + '_sk"]').is(':checked') && $('[id*="cat' + cat_id + '_sk"]').not(':disabled')) {
     $('[id*="cat' + cat_id + '_sk"]').prop('checked', false);
} else if (!$('[id*="cat' + cat_id + '_sk"]').is(':checked') && $('[id*="cat' + cat_id + '_sk"]').not(':disabled')) {
     $('[id*="cat' + cat_id + '_sk"]').prop('checked', 'checked');
}   

再举个例子,如果你想在选中后到达未选中的复选框,只需将你的逻辑分开,例如:

if ($('[id*="cat' + cat_id + '_sk"]').is(':checked')) {
    if ($('[id*="cat' + cat_id + '_sk"]').not(':disabled')) {
         $('[id*="cat' + cat_id + '_sk"]').prop('checked', false);
    } 
} else {
    if ($('[id*="cat' + cat_id + '_sk"]').not(':disabled')) {
         $('[id*="cat' + cat_id + '_sk"]').prop('checked', 'checked');
    }   
}

jQuery中的.not()只是一个减少当前元素集合的过滤器。如果它被禁用,它不会 return 布尔值。

这应该会更好一些:

$('[id*="cat' + cat_id + '_sk"]').each(function(elm) {

    var $elm = $(elm);

    if($elm.is(':checked') && !$elm.is(':disabled')) {
         $elm.removeProp('checked');
    }
    else if(!$elm.is(':checked') && !$elm.is(':disabled')) {
         $elm.prop('checked', 'checked');
    }

});

正如 A. Wolff 上面所说,即使只选中匹配集中的一个复选框,.is(':checked') 也会 return 为真。您需要使用 each.

遍历元素

像这样的? http://jsfiddle.net/swm53ran/133/

if($(this).is(':checked') && $(this).attr('disabled') != 'disabled')

上面的代码行是表示是否选中此复选框且未禁用的逻辑

$(document).ready(function() {
    $('.check').each(function() {
        console.log($(this).attr('disabled'));
        if($(this).is(':checked') && $(this).attr('disabled') != 'disabled') {
            $(this).after('Checked and not disabled');
        }
    });
});

<input type="checkbox" class="check" checked disabled/><br/>
<input type="checkbox" class="check" /><br/>
<input type="checkbox" class="check" checked disabled/><br/>
<input type="checkbox" class="check" checked /><br/>
<input type="checkbox" class="check" /><br/>
<input type="checkbox" class="check" disabled /><br/>
<input type="checkbox" class="check" /><br/>

希望这对您有所帮助