Come faccio a contare quante caselle di controllo sono selezionate su una pagina con jQuery

Question

Voglio contare quante caselle di controllo sulla mia pagina sono selezionate usando jQuery. Ho scritto il seguente codice:

 var numberOfCheckboxesSelected = 0; 
     $(':checkbox').each(function(checkbox) { 
      if (checkbox.attr('checked')) 
       numberOfCheckboxesSelected++; 
     }); 

Tuttavia, i miei errori di codice con il messaggio "oggetto non supporta questa proprietà o metodo" sulla terza riga.

Come faccio a contare quante caselle di controllo sono selezionate sulla mia pagina?

Answer 1

jQuery supporta lo pseudo-selettore :checked.

var n = $("input:checked").length; 

Questo funzionerà per i pulsanti di opzione e le caselle di controllo. Se si desidera solo le caselle di controllo, ma hanno anche pulsanti di opzione nella pagina:

var n = $("input:checkbox:checked").length; 

Answer 2

Prova questa (per evitare di contare eventuali pulsanti di opzione selezionati):

var numberOfCheckboxesSelected = $('input[type=checkbox]:checked').length; 

Answer 3

Il primo argomento passato alla funzione di callback in each è l'indice, non l'elemento. Si dovrebbe usare this o di un secondo argomento:

$(':checkbox').each(function(idx, checkbox) { 
     if (checkbox.attr('checked')) 
      numberOfCheckboxesSelected++; 
}); 

Inoltre, il modo più semplice per farlo è quello di selezionare solo gli elementi controllati con il selettore :checked e quindi controllare length proprietà della selezione:

var numberOfCheckboxesSelected = $('input:checkbox:checked').length; 

Answer 4

$("input:checked").length 

restituirà il conteggio delle caselle di controllo selezionate.