Web-tutoriel

Tutoriels javascript css php java jquery

Vérifier qu’une checkbox est cochée avec jquery 4 janvier , 2010



Pour cela il existe plusieurs méthodes, je vais vous en présenter 3 :

// Première méthode
$('#checkBox').attr('checked'); 
 
// Seconde méthode 
$('#edit-checkbox-id').is(':checked'); 
 
// Troisième méthode
$("input[type=checkbox]:checked").each( 
    function() { 
       // Insérer son code ici
       alert($(this).attr("id"));
    } 
);

Les 2 premières méthodes renvoient TRUE ou FALSE
TRUE si c’est coché et FALSE si ça ne l’est pas.
Il suffit donc d’encapsuler ces méthodes dans un if pour exécuter du code suivant la valeur renvoyée.

La troisième méthode permet d’exécuter du code pour toute les checkbox cochées, dans l’exemple si une chechbox est cochée, on affiche son id.


12 Reponses à “Vérifier qu’une checkbox est cochée avec jquery
Le 5 avril 2012 à 6 h 57 min
Cesar13 a dit:

Merci,
J’ai bien trouvé ce que je cherche.

Le 16 mai 2012 à 14 h 19 min
lycanges a dit:

Parfait,
C’est exactement ce qu’il me fallait (la 3).

Le 6 juin 2012 à 12 h 30 min
Lucas a dit:

Merci beaucoup,

La méthode 3 est exactement ce que je recherchais !

Le 6 juin 2012 à 17 h 14 min
Nicolo a dit:

Heureux que ça vous serve 😉

Le 29 août 2012 à 12 h 45 min
Stephane a dit:

Un tout grand merci !

Le 24 décembre 2012 à 1 h 20 min
hamdi Garfi a dit:

merci b1 ca ce que je cherche

Le 21 juin 2013 à 12 h 38 min
Fabien a dit:

Merci !
Petit bémol : La solution 1 ne fonctionne pas si la checkcbox est coché par défaut (attribut checked dans le code HTML)

Le 21 juin 2013 à 13 h 53 min
Nicolo a dit:

T’es sûr Fabien ?

Avec le code suivant j’ai bien mes 4 alertes sous chrome :

<div>
<input type="checkbox" name="toto" id="toto" checked />
<input type="checkbox" name="toto2" id="toto2" checked="checked" />
<script>
if($("#toto").attr("checked")) alert ("toto checked");
if($("#toto").is(":checked")) alert ("toto is checked");
if($("#toto2").attr("checked")) alert ("toto2 checked");
if($("#toto2").is(":checked")) alert ("toto2 is checked");
</script>
</div>

Le 8 août 2013 à 7 h 51 min
Falco a dit:

Simple, efficace.

Le 16 août 2013 à 17 h 24 min
Lucas a dit:

Une petite astuce très utile, à connaître :).

Je confirme les dires de Fabien à propos de l’attribut checked.
Mais vu que la méthode is fait la même chose… ce n’est pas très grave…

Le 11 septembre 2013 à 10 h 39 min
ISMAL a dit:

MERCI
ça m’as aidé 🙂

Le 29 octobre 2013 à 15 h 07 min
Nicolo a dit:

@Lucas: Je réitère, ça fonctionne : http://jsfiddle.net/uPg6x/

Laissez une réponse

Nom (requis)

Email (requis)

Site Web

Haut