Au travers de ces différentes pages, nous essayerons de vous familiariser avec le Javascript.
Nous vous souhaitons une bonne lecture, mais surtout une bonne programmation :)
Chapitre 12.5 Les boutons case à cocher (checkbox)
Les boutons case à cocher sont utilisés pour noter un ou plusieurs choix (pour rappel avec les boutons radio un seul choix) parmi un ensemble de propositions. A part cela, sa syntaxe et son usage est tout à fait semblable aux boutons radio sauf en ce qui concerne l'attribut name.
| Propriété | Description |
| name | indique le nom du contrôle. Toutes les cases à cocher portent un nom différent. |
| checked | indique l'état en cours de l'élément case à cocher. |
| defaultchecked | indique l'état du bouton sélectionné par défaut. |
| value | indique la valeur de l'élément case à cocher. |
Entrez votre choix :
Il faut sélectionner les numéros 1, 2 et 4 pour avoir la bonne réponse.
<HTML>
<HEAD>
<script language="Javascript">
function reponse(form4) {
if (
(form4.check1.checked) == true && (form4.check2.checked) == true
&& (form4.check3.checked) == false && (form4.check4.checked) ==
true)
{ alert("C'est la bonne réponse! ") }
else
{alert("Désolé, continuez à chercher.")}
}
</SCRIPT>
</HEAD>
<BODY>
Entrez votre choix :
<FORM NAME="form4">
<INPUT TYPE="CHECKBOX" NAME="check1" VALUE="1">Choix numéro 1<BR>
<INPUT TYPE="CHECKBOX" NAME="check2" VALUE="2">Choix numéro 2<BR>
<INPUT TYPE="CHECKBOX" NAME="check3" VALUE="3">Choix numéro 3<BR>
<INPUT TYPE="CHECKBOX" NAME="check4" VALUE="4">Choix numéro 4<BR>
<INPUT TYPE="button"NAME="but" VALUE="Corriger" onClick="reponse(form4)">
</FORM>
</BODY>
</HTML>
Dans le formulaire nommé form4, on déclare quatre cases à cocher. Notez que l'on utilise un nom différent pour les quatre boutons. Vient ensuite un bouton qui déclenche la fonction reponse().
Cette fonction teste quelles cases à cocher sont sélectionnées. Pour avoir la bonne réponse, il faut que les cases 1, 2 et 4 soient cochées. On accède aux cases en utilisant chaque fois leur nom. On teste la propriété checked du bouton par (form4.nom_de_la_case.checked). Dans l'affirmative (&& pour et logique), une boite d'alerte s'affiche pour la bonne réponse. Dans la négative, une autre boite d'alerte vous invite à recommencer.
