如何计算每个选中的复选框

Question

这是我的代码:

它实际上计入已选中的复选框并将其写入内部<span class="counter"></span>.此代码适用于Firefox,但不适用于Chrome.

在Chrome上,.select_all会选中我想要的所有复选框,但不会更新计数器.实际上,当我取消选中.select_all时,计数器会更新,这很奇怪.

重要事实:我不想计算我的.counter中的.Select_all复选框

jQuery(document).ready(function($){

$(function() {
    $('#general i .counter').text(' ');

    var generallen = $("#general-content input[name='wpmm[]']:checked").length;
    if(generallen>0){$("#general i .counter").text('('+generallen+')');}else{$("#general i .counter").text(' ');}
})

$("#general-content input:checkbox").on("change", function() {
    var len = $("#general-content input[name='wpmm[]']:checked").length;
    if(len>0){$("#general i .counter").text('('+len+')');}else{$("#general i .counter").text(' ');}
});


$(function() {
    $('.select_all').change(function() {
        var checkthis = $(this);
        var checkboxes = $(this).parent().next('ul').find("input[name='wpmm[]']");

        if(checkthis.is(':checked')) {
            checkboxes.attr('checked', true);
        } else {
            checkboxes.attr('checked', false);
        }
    });
});

});

编辑:这是代码的示例文档:http://jsfiddle.net/8PVDy/1/

Answer 1

您可以使用函数更新计数器:

function updateCounter() {
    var len = $("#general-content input[name='wpmm[]']:checked").length;
    if(len>0){$("#general i .counter").text('('+len+')');}else{$("#general i .counter").text(' ');}
}

当复选框的状态发生变化时调用此函数(包括selectAll复选框)

这是一个更新的jsFiddle:http://jsfiddle.net/8PVDy/4/

Answer 2

$('input[type="checkbox"]:checked').length

Answer 3

你可以这样做

$(document).ready(function(){
$('input[type="checkbox"]').click(function(){
    alert($('.test:checked').length);

});
});

我使用的HTML

<input type="checkbox" name="test" class="test" value=""/>  
<input type="checkbox" name="test" class="test" value=""/>  
<input type="checkbox" name="test" class="test" value=""/>  
<input type="checkbox" name="checkAll" class="checkAll" value=""/>

希望这可以帮助