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.