Je suis nouveau sur la plateforme et j'ai un soucis comme vous avez pu le voir au titre....
J'ai un projet en cours qui consiste à mêler HTML/CSS et JavaScript, une personne s'occupe de la partie HTML/CSS et la seconde du JavaScript.
Justement je m'occupe de la partie JavaScript sur un QCM, sur 10 questions (pour l'instant j'en ai mit que 3 pour tester), après avoir cocher les bonnes cases on appuie sur le bouton vérifier et rien ne se passe ! Je regarde dans la console et on me met des erreurs que je ne comprends pas...
Voici mon Jscript :
function score(){
var q1=0;
var q2=0; //Ces variables stockerons le score de la question, 0 étant faux et 1 correcte
var q3=0;
}
function testReponse(nom,n){ //Fonction de test des réponses, le "nom" seras la "name" du group de questions à tester et le "n" seras le nombre de réponses possibles de la question, ici toujours 3
var rep=true; //On déclare la variable comme true par défaut, c'est le principe de Présomption d'innocence, tant que la réponse n'est pas définis comme fausse, alors on a bon
for (i=0; i<n; i++) //Ce pour feras le tour des réponses possibles
{
if (nom[i].value==1 && nom[i].checked==false) rep=false; //Si la case (checkbox) i est correcte (value==1) mais que celle-ci n'est pas cochée alors la variable rep prend la valeur false
if (nom[i].value==0 && nom[i].checked==true) rep=false; //Si la case (checkbox) i est fausse (value==0) mais que celle-ci est cochée alors la variable rep prend la valeur false
}
return rep; //On retourne la variable rep qui nous permettras de savoir si on a eu faux ou corecte à la question
}
function score1(){document.QCM.resultat.value=q1+q2+q3} //Fonction qui affichera la somme des questions dans la boite de texte nommée "resultat" située dans notre formulaire nommé "QCM" de notre document
function total(){
if (testReponse(Question1,3){
q1=1;
}
else{
q1=0;
}
if (testReponse(Question2,3)){
q2=1;
}
else{
q2=0;
}
if (testReponse(Question3,3)){
q3=1;
}
else{
q3=0;
}
Number(q1);
Number(q2);
Number(q3);
score1();
}
Et l'HTML sur la page QCM :
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/><!-- Cette balise indique l'encodage utilisé. "utf-8" permet d'afficher sans aucun problème pratiquement tous les symboles de toutes les langues -->
<script type="text/javascript" src="qcmjavascript.js"></script>
<title>QCM</title>
</head>
<body>
<h1>Questions à Choix Multiples (QCM)</h1>
<form name="QCM"> <!-- Début du QCM définit par <form> -->
<p>Il y a une ou plusieurs réponses justes à chaques questions.</p>
</br>
<p>Pour avoir juste à la question il faut avoir toutes les réponses correctes et aucune fausse.</p>
<p>Combien de fois Valentino Rossi à été champion du monde ?</p>
<input type="checkbox" name="Question1" value=0>7 fois</input> <!-- le "name" est le même pour savoir de quelle question nous parlons, ici la Question une -->
</br>
<input type="checkbox" name="Question1" value=1>9 fois</input> <!-- L'attribut "value" montre la bonne réponse, "1" signifie la bonne réponse et "0" la mauvaise -->
</br>
<input type="checkbox" name="Question1" value=0>15 fois</input>
<p>Thierry Omeyer a-t-il été sacré meilleur gardien de foot 2017 ?</p>
<input type="checkbox" name="Question2" value=0>Oui</input>
</br>
<input type="checkbox" name="Question2" value=1>Non</input>
</br>
<p>Il ya 14 joueurs sur un terrain de handball</p>
<input type="checkbox" name="Question3" value=1>Vrai</input>
</br>
<input type="checkbox" name="Question3" value=0>Faux</input>
</br>
</br>
<!-- commentaire expliquant la partie ci-dessous pour ne pas fausser le code -->
<!-- L'attribut "OnClick" utilisé pour un bouton signifie que lorsque que l'on clicque sur le bouton, les opérations du OnClick seront exécutées -->
<!-- Si la question 1 a été répondu correctement, alors if(test(Question1,3)) devient if(true), alors Q1=1 et si elle a été répondu comme fausse alors ce seras Q1=0. Même principe pour les autres questions-->
<!-- Number(x) : On convertit ces trois variables en nombre afin de faire la somme des trois -->
<!-- score1() : On affiche le score -->
<input type="button" name="Bouton" value="Valider vos réponses" OnClick="total()"></input>
Votre score est :
<input type="text" name="resultat" size="1" value="X"></input>
/3
</form> <!-- Fin du formulaire de questions -->
</body>
</html>
Merci je viens de le corriger ! Mais maintenant il me met Question1 is not defined comme erreur, hors avant j'avais mit toute la function total() dans la ligne 50 de mon HTML sur le OnClick pour enlever cette erreur, mais ça en emmenait d'autres erreurs...
Question1 est le nom d'une question dans le document HTML, je ne l'ai pas définit en variable car au début dans la fonction testReponse je définis le (nom,n), ça veut dire qu'il faut que je remette la fonction total dans l'HTML ?
Salut MonkROOMS. Je me suis amusé à refaire le code pour que ça fonctionne et que ça reste clair. Si tu ne comprends pas quelque chose, n'hésite surtout pas à poser des questions. Et si tu ne veux pas d'une solution toute faite, ne lis pas ce qui suit.
mohzah il me faut les checkbox, car il faut plusieurs possibilités de réponses :/
Merci beaucoup Ench ! Juste quelques questions si cela ne te dérange pas,
que signifie fieldset ?
je ne connais que le JavaScript de base donc je ne comprends pas réellement les commandes que tu rentres comme f.querySelectorAll ; bt.addEventListener ou les caractères '$, peux-tu me l'expliquer si ça ne te dérange pas ? Merci infiniment !
Dans le code, "f" est un élément du tableau de fieldsets (car [... document.querySelectorAll('fieldset')] veut dire que dans le html on prend tous les fieldsets et qu'on les met dans un tableau). https://developer.mozilla.org/fr/docs/Web/API/Document/querySelectorAll
bt.addEventListener... veut dire que pour le bouton (présent dans le html) on écoute un évenement (ici le clic). En gros, quand on clic sur le bouton,on afficher le résultat.
${...} : ceci permet de mettre une variable dans une chaine. À la place de `${results.filter(item => item === true).length}/${results.length}`, on peut écrire ça :
Comment peut-on mettre un message d'alerte avec "Vous aves X sur 20" je sais faire un message mais pour ici comment peut-on faire avec ce code JavaScrpit ?
× Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
× Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
Nodo : Bibliothèque JS pour manipuler le DOM facilement.
Nodo : Bibliothèque JS pour manipuler le DOM facilement.
Nodo : Bibliothèque JS pour manipuler le DOM facilement.
Nodo : Bibliothèque JS pour manipuler le DOM facilement.