jQuery：計數選中的複選框 - 錯誤的計數

Question

我有一個計數選中的複選框的代碼。選擇時它工作正常，但是當我取消選擇一些已經選擇的複選框時，計數會中斷（計數加1）。

HTML：

<div>Number of checkboxes checked: <span id='chck'>0</span></div> 
<table> 
    <tr><td><input type='checkbox' /></td></tr> 
    <tr><td><input type='checkbox' /></td></tr> 
    <tr><td><input type='checkbox' /></td></tr> 
    <tr><td><input type='checkbox' /></td></tr> 
    <tr><td><input type='checkbox' /></td></tr> 
    <tr><td><input type='checkbox' /></td></tr> 
    <tr><td><input type='checkbox' /></td></tr>  
</table> 

JS：

$('tr :checkbox').change(function(){ 

    $('#chck').text($(this).add(':checked').length); 

}); 

FIDDLE：http://jsfiddle.net/kAsxj/

Answer 1

http://jsfiddle.net/kAsxj/3/

不知道爲什麼你正在使用$(this).add(':checked')時只需$(':checked')會足夠了。

Answer 2

試試這個

$('#chck').text($('input[type="checkbox"]:checked').length); 
    //gets all input checkboxes 

或與輸入特定的表，你可以做到這一點

$('#chck').text($(this).closest('table').find(':checked').length); 
//gets all input checkboxes within the table 

DEMO

Answer 3

當你check或取消選中一個複選框計數不會自動增加，所以你需要：

$('input[type="checkbox"]').change(function(){ 
    $('#chck').text($('input[type="checkbox"]:checked').length); 
}).change(); 

JS Fiddle demo。

Answer 4

DEMO

$('tr :checkbox').change(function(){ 
     $('#chck').text($(':checkbox:checked').length); 
    });