Javascript : exemples avec le code source

H - Cases à cocher

Questions à choix multiples

Parmis les personnes célèbres suivantes, lesquelles sont des scientifiques ?
Albert Einstein
Niels Bohr
Honoré de Balzac

Code html (utilisant l'identité des objets)

<html>
<head>
<script language="javascript">
function valider() {
var texte="";
if (document.getElementById("casea").checked) {
document.getElementById("casea").disabled=true;
} else {
texte=texte+'\nA. Einstein a énoncé la théorie de la relativité.';
}
if (document.getElementById("caseb").checked) {
document.getElementById("caseb").disabled=true;
} else {
texte=texte+'\nN. Bohr a proposé un modèle pour l\'atome.';
}
if (!document.getElementById("casec").checked) {
document.getElementById("casec").disabled=true;
} else {
texte=texte+'\nHonoré de balzac a écrit le roman "La peau de chagrin".';
}
if (texte=="") {
texte="BRAVO !!!";
}
alert(texte);
}
</script>
</head>
<body>
<div>Parmis les personnes célèbres suivantes, lesquelles sont des scientifiques ?</div>
<input id="casea" type="checkbox">Albert Einstein<br>
<input id="caseb" type="checkbox">Niels Bohr<br>
<input id="casec" type="checkbox">Honoré de Balzac<br>
<div style="text-align:center"><input type="button" value="Valider" onClick="valider()"></div>
</body>
</html>


Code html (utilisant les formulaires et le nom des objets)

<html>
<head>
<script language="javascript">
function valider() {
var texte="";
if (document.formu.casea.checked) {
document.formu.casea.disabled=true;
} else {
texte=texte+'\nA. Einstein a énoncé la théorie de la relativité.';
}
if (document.formu.caseb.checked) {
document.formu.caseb.disabled=true;
} else {
texte=texte+'\nN. Bohr a proposé un modèle pour l\'atome.';
}
if (!document.formu.casec.checked) {
document.formu.casec.disabled=true;
} else {
texte=texte+'\nHonoré de balzac a écrit le roman "La peau de chagrin".';
}
if (texte=="") {
texte="BRAVO !!!";
}
alert(texte);
}
</script>
</head>
<body>
<div>Parmis les personnes célèbres suivantes, lesquelles sont des scientifiques ?</div>
<form name="formu">
<input name="casea" type="checkbox">Albert Einstein<br>
<input name="caseb" type="checkbox">Niels Bohr<br>
<input name="casec" type="checkbox">Honoré de Balzac<br>
<div style="text-align:center"><input type="button" value="Valider" onClick="valider()"></div>
</form>
</body>
</html>
Validé XHTML 1.1    Validé CSS