jQuery voir si une ou aucune case à cocher n'est cochée


126

Je sais comment voir si une case individuelle est cochée ou non.

Mais j'ai des problèmes avec ce qui suit - étant donné un identifiant de formulaire, j'ai besoin de voir si l' une des cases à cocher est cochée (c'est-à-dire 1 ou plus), et j'ai besoin de voir si aucune n'est sélectionnée. Fondamentalement, j'ai besoin de deux fonctions distinctes qui répondent à ces deux questions. Une aide serait appréciée. Merci!

En fait, j'aurais juste besoin d'une fonction pour me dire si aucune n'est sélectionnée. Sachant cela répondrait à l'autre question.


Réponses:


246

Vous pouvez utiliser quelque chose comme ça

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

8
$("#formID input:checkbox:checked").lengthserait suffisant ici aussi
Damon

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

11
jQuery dit à propos du :checkboxsélecteur :,For better performance in modern browsers, use [type="checkbox"] voir api.jquery.com/checkbox-selector - idem pour radiobuttons btw, use [type="radio"] rather than :radio api.jquery.com/radio-selector
Adrien Be

27

JQuery .istestera tous les éléments spécifiés et retournera true si au moins l'un d'entre eux correspond au sélecteur:

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

Bien que cela is()semble fonctionner, avoir :checkeddirectement dans le sélecteur comme indiqué dans la réponse de @ rahul semble plus approprié. is () semble plus utile lors de "rappels internes", voir api.jquery.com/is . Ou est-ce que je manque quelque chose?
Adrien Be

Non, c'est à peu près ce qui est écrit dans les documents - vous vérifiez si un élément correspond à l'attribut spécifié. Appliquer c'est comme filtre, puis vérifier si vous obtenez au moins un élément dans le résultat est le même mais je suis plus long et pas si expressif.
Michael Logutov

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

À savoir $("form input[type=checkbox]").is(":checked")pourrait être une approche plus simple et plus générique.
Adrien Be

@AdrienBe Using ispourrait être de meilleures performances, car il s'arrête dès qu'il en trouve un.
ChrisW

8

Tu peux le faire:

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

Où:

  • :checkbox le sélecteur de filtre coche toutes les cases.
  • :checked sélectionnera les cases cochées
  • length donnera le nombre de vérifiés là-bas

jQuery dit à propos du :checkboxsélecteur :,For better performance in modern browsers, use [type="checkbox"] voir api.jquery.com/checkbox-selector
Adrien Be

6

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

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

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

         //Do something.

});     

6

Sans utiliser 'length', vous pouvez le faire comme ceci:

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

3

Vous pouvez faire un simple retour de .lengthici:

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

Cette recherche de cases à cocher dans la forme donnée, voit s'il y en a :checkedet renvoie truesi elles le sont (puisque la longueur serait 0 sinon). Pour rendre les choses un peu plus claires, voici la version convertie non booléenne:

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

Cela renverrait un décompte du nombre de vérifications.


3

La réponse de Rahul est la mieux adaptée à votre question. Quoi qu'il en soit, 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 à cocher que vous souhaitez cocher, par exemple un nom de classe test_checket maintenant vous pouvez vérifier si l'une des cases à cocher est cochée appartenant au groupe en:

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

S'il retourne true, supposons qu'une ou plusieurs cases à cocher sont cochées avec le nom de la classe test_checket aucune cochée si retourne false.

J'espère que ça aide quelqu'un. Merci :)-


1

C'est la meilleure façon de résoudre ce problème.

  if($("#checkbox").is(":checked")){

  // Do something here /////

  };

Salut, bienvenue dans StackOverflow. Peut-être pourriez-vous décrire votre réponse un peu plus, car on ne voit pas pourquoi c'est la «meilleure façon» de résoudre le problème.
dddJewelsbbb le
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.