2010-11-03 5 views
98

Je sais comment voir si une case individuelle est cochée ou non.jQuery voir si des cases sont cochées ou non

Mais Im ayant des problèmes avec les éléments suivants - donné une forme id Je dois voir si une des cases sont cochées (i.e. 1 ou plus), et je dois voir si aucun sont sélectionnés. Fondamentalement, j'ai besoin de deux fonctions distinctes qui répondent à ces deux questions. L'aide serait appréciée. Merci!

En fait, je voudrais juste une fonction pour me dire si aucun sont sélectionnés. Sachant cela répondrait à l'autre question.

+0

http://stackoverflow.com/questions/901712/check-checkbox-checked-property-using-jquery –

Répondre

192

Vous pouvez utiliser quelque chose comme ça

if ($("#formID input:checkbox:checked").length > 0) 
{ 
    // any one is checked 
} 
else 
{ 
    // none is checked 
} 
+6

'$ (" # formID inpu t: checkbox: cochée "). length' suffirait ici aussi, trop – Damon

+1

jQuery doc http://api.jquery.com/checked-selector/ –

+0

@Damon Je suppose que vous vouliez dire' if ($ ("# formID input: checkbox: cochée "). length) {}' (sans le '> 0') serait suffisant car 0 est une valeur falsey, voir http://james.padolsey.com/javascript/truthy-falsey/ –

6

Vous pouvez le faire:

if ($('#form_id :checkbox:checked').length > 0){ 
    // one or more checkboxes are checked 
    } 
    else{ 
    // no checkboxes are checked 
    } 

Où:

  • :checkbox sélecteur de filtre sélectionne toutes les cases à cocher.
  • :checked sélectionneront vérifié cases
  • length donnera le nombre de vérifiés ceux là
+0

jQuery dit à propos du sélecteur ': checkbox':' Pour de meilleures performances dans les navigateurs modernes, utilisez [type = "case à cocher "]', voir http://api.jquery.com/checkbox-selector/ –

3

Vous pouvez faire un simple retour du .length ici:

function areAnyChecked(formID) { 
    return !!$('#'+formID+' input[type=checkbox]:checked').length; 
} 

Cette recherche des cases à cocher dans le formulaire donné, voit s'il y en a :checked et renvoie true si elles le sont (puisque la longueur serait 0 autrement). Pour le rendre un peu plus clair, voici la version convertie non booléenne:

function howManyAreChecked(formID) { 
    return $('#'+formID+' input[type=checkbox]:checked').length; 
} 

Cela reviendrait un compte de combien ont été vérifiés.

21

JQuery .is testera tous les éléments spécifiés et retourne vrai si au moins l'un d'entre eux correspond sélecteur:

if ($(":checkbox[name='choices']", form).is(":checked")) 
{ 
    // one or more checked 
} 
else 
{ 
    // nothing checked 
} 
+0

Bien que 'is()' semble fonctionner, ayant ': checked' directement dans le sélecteur comme indiqué dans la réponse de @ rahul semble plus approprié. is() semble plus utile lorsque "callbacks à l'intérieur", voir http://api.jquery.com/is/. Ou est-ce que je manque quelque chose? –

+0

Non, c'est à peu près ce qui est écrit dans docs - vous vérifiez si un élément correspond à l'attribut spécifié. L'appliquer comme filtre et ensuite vérifier si vous obtenez au moins un élément dans le résultat est le même mais imo plus long et pas si expressif. –

+0

+1 pour le fait que '.is (": checked ")' dans votre solution est plus expressif, mais pas sûr du reste. –

2

réponse de Rahul est mieux adaptée à votre question. De toute façon, si vous avez un groupe de cases à cocher à cocher et pas toutes les cases à cocher dans votre formulaire, vous pouvez y aller.

Mettez un nom de classe pour toutes les cases que vous voulez vérifier, par exemple, par exemple, un nom de classe test_check et maintenant vous pouvez vérifier si l'une des case est cochée appartenant au groupe par:

$("#formID .test_check:checked").length > 0 

Si elle renvoie true, supposons qu'une ou plusieurs cases à cocher sont vérifiées avec le nom de classe test_check et aucune n'est cochée si renvoie false.

Espérons que cela aide quelqu'un.Merci:) -

1

C'est ce que j'ai utilisé pour vérifier si toutes les cases à cocher dans une liste de cases à cocher avaient changé:

$('input[type="checkbox"]').change(function(){ 

     var itemName = $('select option:selected').text(); 

     //Do something. 

});  
0

Sans utiliser, vous pouvez le faire comme cette « longueur »:

if ($('input[type=checkbox]').is(":checked")) { 
     //any one is checked 
} 
else { 
//none is checked 
} 
Questions connexes