如何獲得基於特定的類

Question

我已經陷在越來越選中的複選框的複選框的總數，當我點擊下面選擇

$("#SelctCheckAll").click(function() { 
     $('input:checkbox').not(this).prop('checked', this.checked); 
     var numberOfChecked = $('input:checkbox:checked').length; 
     var totalCheckboxes = $('input:checkbox').length; 
    }); 

所有的代碼所示。這樣它的正常工作得到的複選框的總數。但我的疑問是，當我添加兩個類，例如class =「checkbox1」和class =「checkbox2」都有type = checkbox。

例如，class = checkbox1包含6個複選框，class = checkbox2包含10個複選框。那麼如何獲得class = checkbox1的複選框總數，反之亦然？下面

<input type="checkbox" id="SelctCheckAll" name="SelctCheckAll"> 
<input type="checkbox" class="checkbox1"> 
<input type="checkbox" class="checkbox2"> 

Answer 1

用樣品只需要類的名稱添加到您已經在使用這一說法，得到checked複選框：

$('input.checkbox1:checkbox:checked').length 

$("#SelctCheckAll").click(function() { 
 
    $('input:checkbox').not(this).prop('checked', this.checked); 
 
    var numberOfChecked = $('input:checkbox:checked').length; 
 
    var totalCheckboxes = $('input:checkbox').length; 
 

 
    var checkbox1 = $('input.checkbox1:checkbox:checked').length; 
 
    console.log('Total checkbox1: ' + checkbox1); 
 

 
    var checkbox2 = $('input.checkbox2:checkbox:checked').length; 
 
    console.log('Total checkbox2: ' + checkbox2); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="checkbox" id="SelctCheckAll" name="SelctCheckAll"> 
 
<input type="checkbox" class="checkbox1"> 
 
<input type="checkbox" class="checkbox1"> 
 
<input type="checkbox" class="checkbox1"> 
 
<input type="checkbox" class="checkbox1"> 
 
<input type="checkbox" class="checkbox1"> 
 
<input type="checkbox" class="checkbox1"> 
 
<input type="checkbox" class="checkbox1"> 
 

 
<input type="checkbox" class="checkbox2"> 
 
<input type="checkbox" class="checkbox2"> 
 
<input type="checkbox" class="checkbox2"> 
 
<input type="checkbox" class="checkbox2"> 
 
<input type="checkbox" class="checkbox2"> 
 
<input type="checkbox" class="checkbox2"> 
 
<input type="checkbox" class="checkbox2">

Answer 2

你可以得到檢查複選框的總數如下：

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

或使用class，如：

$('.class1').is(':checked').length; 

Answer 3

<input type="checkbox" id="SelctCheckAll" name="SelctCheckAll" class="testcheckbox"> 
<input type="checkbox" class="testcheckbox"> 
<input type="checkbox" class="testcheckbox"> 

var count = $('input[type="checkbox"].testcheckbox').length; 
alert(count); 

Answer 4

var checkbox1 = $('input.checkbox1:checkbox:checked').length; //for class checkbox1 
var checkbox2 = $('input.checkbox2:checkbox:checked').length; //for class checkbox2 

Answer 5

你去那裏用短小提琴：

我用了jQuery filter()方法來獲取所有我需要的信息 - 比如帶有某個c的複選框的總數lass，也只有選中的某個類的複選框。

看一看工作小提琴這裏：

var elems = $('input[type="checkbox"]'); 
 

 
elems.on('click', function(e){ 
 
\t if(e.target.id === "SelectCheckAll") elems.prop('checked', (elems.prop('checked')) ? true : false); 
 
\t getStatistics(); 
 
}); 
 

 
function getStatistics(){ 
 
\t console.log('Total count of ".checkbox1":' + elems.filter(".checkbox1").length); 
 
    console.log('Total count of ".checkbox2":' + elems.filter(".checkbox2").length); 
 
    console.log('Count of checked ".checkbox1":' + elems.filter(".checkbox1:checked").length); 
 
    console.log('Count of checked ".checkbox2":' + elems.filter(".checkbox2:checked").length); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="checkbox" id="SelectCheckAll" name="SelctCheckAll"> 
 

 
<input type="checkbox" class="checkbox1"> 
 
<input type="checkbox" class="checkbox1"> 
 
<input type="checkbox" class="checkbox1"> 
 
<input type="checkbox" class="checkbox1"> 
 
<input type="checkbox" class="checkbox1"> 
 

 
<input type="checkbox" class="checkbox2"> 
 
<input type="checkbox" class="checkbox2"> 
 
<input type="checkbox" class="checkbox2"> 
 
<input type="checkbox" class="checkbox2">