QUESTIONNAIRE-QUIZ quiz, questionnaire, question, questions, jeu, Source N°42501

Information sur la source

Catégorie :Jeux Classé sous : quiz, questionnaire, question, questions, jeu Niveau : Débutant Date de création : 29/04/2007 Date de mise à jour : 30/04/2007 18:14:10 Vu / téléchargé: 9 067 / 564

Auteur : Laffrey

Site perso

Ecrire un message privé

Note :
Aucune note

Commentaire sur cette source (9)

Ajouter un commentaire et/ou une note

Description

Cliquez pour voir la capture en taille normale

Ceci est un questionnaire. Une fois les réponses entrées, le script vérifie la réponse, affiche la solution et une image (V ou X).

Source

<html>
<head>
<title>Questionnaire</title>
<SCRIPT language="JavaScript">
var nbquestions = 2; //le nombre de questions
var reponse = new Array(2); //le nombre de réponses
reponse[0] = "est"; //les réponses (en partant de 0!!!)
reponse[1] = "suis";
//vous pouvez rajouter : reponse[2] = "lrgelgft"; ... Attention, pensez a modifier nbquestions et reponse !!!
function correction() {
var score = 0;
for (var i=0; i<nbquestions; i++) {
var proposition = document.getElementsByName("prop");
imput_prop = proposition[i];
if (imput_prop.value == reponse[i]) {
score++; //augmente le score d'1 point
var images_vrai = document.getElementsByName("vrai");
img_vrai = images_vrai[i];
img_vrai.style.display="inline"; //affiche l'image "vrai"
var solution = document.getElementsByName("solution");
imput_solution = solution[i];
imput_solution.value = "("+reponse[i]+")"; //affiche la solution
imput_solution.style.display = "inline"; //affiche le bouton "solution"
imput_solution.style.color = "#00CC00"; //colore le texte en vert
}
else {
var images_faux = document.getElementsByName("faux");
img_faux = images_faux[i]
img_faux.style.display="inline"; //affiche l'image "faux"
var solution = document.getElementsByName("solution");
imput_solution = solution[i];
imput_solution.value = "("+reponse[i]+")"; //affiche la solution
imput_solution.style.display = "inline"; //affiche le bouton "solution"
imput_solution.style.color = "#FF0000"; //colore le texte en rouge
}
}
document.getElementById("total").value= score+"/"+nbquestions; //affiche le score dans le boutton "total"
for (var i=0; i<nbquestions; i++) {
var proposition = document.getElementsByName("prop");
imput_prop = proposition[i];
imput_prop.disabled = true; //empêche la modification des données des boutons "prop"
}
}
function efface() {
location.reload(); //recharge la page
return(false);
}
</script>
</head>
<body>
<p>Compléter avec le verbe conjugué :</p>
<form id="questions">
<p><img name="vrai" border="0" src="images/vrai.jpg" width="20" height="20" id="image1_1" style="display:none"><img name="faux" border="0" src="images/faux.jpg" width="20" height="20" id="image1_2" style="display:none">    1.Il <input name="prop" type="text" id="button1" size="10"><input name="solution" style="display:none;font-weight:bold;border:none" type="text" id="button1" size="5" readonly="readonly"> (être) pompier.</p>
<p><img name="vrai" border="0" src="images/vrai.jpg" width="20" height="20" id="image2_1" style="display:none"><img name="faux" border="0" src="images/faux.jpg" width="20" height="20" id="image2_2" style="display:none">    2.Je <input name="prop" type="text" id="button2" size="10"><input name="solution" style="display:none;font-weight:bold;border:none" type="text" id="button1" size="5" readonly="readonly"> (être) sous la douche.</p>
</form>
<form id="questionnaire">
<p><input id="corriger" type="button" value="CORRIGER" onClick="correction()">
<input id="effacer" type="button" value="EFFACER" onClick="efface()"></p>
<p>Votre score : <input type="text" id="total" readonly="readonly" size="1"></p>
</form>
</body>
</html>

<html>

<head>

<title>Questionnaire</title>

<SCRIPT language="JavaScript">
var nbquestions = 2;			//le nombre de questions
var reponse = new Array(2);		//le nombre de réponses
reponse[0] = "est";			//les réponses (en partant de 0!!!)
reponse[1] = "suis";
//vous pouvez rajouter : reponse[2] = "lrgelgft"; ... Attention, pensez a modifier nbquestions et reponse !!!

function correction() {
var score = 0;
	for (var i=0; i<nbquestions; i++) {
		var proposition = document.getElementsByName("prop");
		imput_prop = proposition[i];
		if (imput_prop.value == reponse[i]) {
			score++;	//augmente le score d'1 point
			var images_vrai = document.getElementsByName("vrai");
			img_vrai = images_vrai[i];
			img_vrai.style.display="inline";  			//affiche l'image "vrai"
			var solution = document.getElementsByName("solution");
			imput_solution = solution[i];
			imput_solution.value = "("+reponse[i]+")";		//affiche la solution
			imput_solution.style.display = "inline";		//affiche le bouton "solution"
			imput_solution.style.color = "#00CC00";			//colore le texte en vert
		}
		else {
			var images_faux = document.getElementsByName("faux");
			img_faux = images_faux[i]
			img_faux.style.display="inline";			//affiche l'image "faux"
			var solution = document.getElementsByName("solution");
			imput_solution = solution[i];
			imput_solution.value = "("+reponse[i]+")";		//affiche la solution
			imput_solution.style.display = "inline";		//affiche le bouton "solution"
			imput_solution.style.color = "#FF0000";			//colore le texte en rouge
		}
	}
	document.getElementById("total").value= score+"/"+nbquestions;		//affiche le score dans le boutton "total"
	for (var i=0; i<nbquestions; i++) {
		var proposition = document.getElementsByName("prop");
		imput_prop = proposition[i];
		imput_prop.disabled = true;					//empêche la modification des données des boutons "prop"
	}
}

function efface() {
		location.reload();						//recharge la page
		return(false);
}
</script>

</head>

<body>

<p>Compléter avec le verbe conjugué :</p>

<form id="questions">
  <p><img name="vrai" border="0" src="images/vrai.jpg" width="20" height="20" id="image1_1" style="display:none"><img name="faux" border="0" src="images/faux.jpg" width="20" height="20" id="image1_2" style="display:none">&nbsp;&nbsp;&nbsp;&nbsp;1.Il <input name="prop" type="text" id="button1" size="10"><input name="solution" style="display:none;font-weight:bold;border:none" type="text" id="button1" size="5" readonly="readonly"> (être) pompier.</p>
  <p><img name="vrai" border="0" src="images/vrai.jpg" width="20" height="20" id="image2_1" style="display:none"><img name="faux" border="0" src="images/faux.jpg" width="20" height="20" id="image2_2" style="display:none">&nbsp;&nbsp;&nbsp;&nbsp;2.Je <input name="prop" type="text" id="button2" size="10"><input name="solution" style="display:none;font-weight:bold;border:none" type="text" id="button1" size="5" readonly="readonly"> (être) sous la douche.</p>
</form>
<form id="questionnaire">
  <p><input id="corriger" type="button" value="CORRIGER" onClick="correction()">
  <input id="effacer" type="button" value="EFFACER" onClick="efface()"></p>
  <p>Votre score : <input type="text" id="total" readonly="readonly" size="1"></p>
</form>
</body>

</html>

Conclusion

C'est tout !!!

Fichier Zip

Pour les "Membres Club", vous pouvez télécharger directement un fichier contenu dans le zip sans télécharger le zip en entier !

quiz
- images
  - faux.jpg 13 368 octets
  - Thumbs.db6 144 octets
  - vrai.jpg 11 830 octets
- quiz.html 7 428 octets

Télécharger le zip

Historique

30 avril 2007 11:32:37 :: Un petit problème ...
30 avril 2007 11:40:34 :: Problème dans le zip ...
30 avril 2007 18:14:10 :: Rajout de commentaires...

Sources du même auteur

SUDOKUS PAREIL MAIS EN MIEUX

Toutes les sources de Laffrey

Sources de la même categorie

Toutes les sources de la catégorie Jeux

Sources en rapport avec celle ci

Commentaires

Commentaire de routry le 13/05/2007 14:22:01

Bonjour à tous,

Je tente un rajout de verification des champs input par un javascript function CheckInput() avant d'avoir la correction du quiz et cela ne fonctionne pas les champs sont remplis mais j'ai toujours le message "Tous les champs n'ont pas été remplis!"
Merci par avance du petit coup de pouce qui me sera apporté.

<html>

<head>

<title>Questionnaire</title>
<script type="text/javascript">

</script>
<SCRIPT language="JavaScript">
var nbquestions = 2;                        //le nombre de questions
var reponse = new Array(2);                //le nombre de réponses
reponse[0] = "est";                        //les réponses (en partant de 0!!!)
reponse[1] = "suis";
//vous pouvez rajouter : reponse[2] = "lrgelgft"; ... Attention, pensez a modifier nbquestions et reponse !!!

function correction() {
var score = 0;
        for (var i=0; i<nbquestions; i++) {
                var proposition = document.getElementsByName("prop");
                imput_prop = proposition[i];
                if (imput_prop.value == reponse[i]) {
                        score++;        //augmente le score d'1 point
                        var images_vrai = document.getElementsByName("vrai");
                        img_vrai = images_vrai[i];
                        img_vrai.style.display="inline";                          //affiche l'image "vrai"
                        var solution = document.getElementsByName("solution");
                        imput_solution = solution[i];
                        imput_solution.value = "("+reponse[i]+")";                //affiche la solution
                        imput_solution.style.display = "inline";                //affiche le bouton "solution"
                        imput_solution.style.color = "#00CC00";                        //colore le texte en vert
                }
                else {
                        var images_faux = document.getElementsByName("faux");
                        img_faux = images_faux[i]
                        img_faux.style.display="inline";                        //affiche l'image "faux"
                        var solution = document.getElementsByName("solution");
                        imput_solution = solution[i];
                        imput_solution.value = "("+reponse[i]+")";                //affiche la solution
                        imput_solution.style.display = "inline";                //affiche le bouton "solution"
                        imput_solution.style.color = "#FF0000";                        //colore le texte en rouge
                }
        }
        document.getElementById("total").value= score+"/"+nbquestions;                //affiche le score dans le boutton "total"
        for (var i=0; i<nbquestions; i++) {
                var proposition = document.getElementsByName("prop");
                imput_prop = proposition[i];
                imput_prop.disabled = true;                                        //empêche la modification des données des boutons "prop"
        }
}

function efface() {
                location.reload();                                                //recharge la page
                return(false);
}
</script>

</head>

<body>

<p>Compléter avec le verbe conjugué :</p>

<form id="questions">
  <p><img name="vrai" border="0" src="images/vrai.jpg" width="20" height="20" id="image1_1" style="display:none"><img name="faux" border="0" src="images/faux.jpg" width="20" height="20" id="image1_2" style="display:none">    1.Il <input name="prop" type="text" id="button1" size="10"><input name="solution" style="display:none;font-weight:bold;border:none" type="text" id="button1" size="5" readonly="readonly"> (être) pompier.</p>
  <p><img name="vrai" border="0" src="images/vrai.jpg" width="20" height="20" id="image2_1" style="display:none"><img name="faux" border="0" src="images/faux.jpg" width="20" height="20" id="image2_2" style="display:none">    2.Je <input name="prop" type="text" id="button2" size="10"><input name="solution" style="display:none;font-weight:bold;border:none" type="text" id="button1" size="5" readonly="readonly"> (être) sous la douche.</p>
</form>
<form id="questionnaire">
  <p><input id="corriger" type="button" value="CORRIGER" onClick="return CheckInput(); correction()">
  <input id="effacer" type="button" value="EFFACER" onClick="efface()"></p>
  <p>Votre score : <input type="text" id="total" readonly="readonly" size="1"></p>



</body>

</html>
Commentaire de Laffrey le 13/05/2007 17:38:37

Salut ROUTRY,

Voilà la reponses à ta question :

<html>

<head>

<title>Questionnaire</title>

<SCRIPT language="JavaScript">
var nbquestions = 2;                        //le nombre de questions
var reponse = new Array(2);                //le nombre de réponses
reponse[0] = "est";                        //les réponses (en partant de 0!!!)
reponse[1] = "suis";
//vous pouvez rajouter : reponse[2] = "lrgelgft"; ... Attention, pensez a modifier nbquestions et reponse !!!

function CheckInput() {
var rempli = 2
for(i=0; i<nbquestions; ++i){
                var proposition = document.getElementsByName("prop");
                imput_prop = proposition[i];
   if(imput_prop.value == "")  {
     alert("Tous les champs n'ont pas été remplis!");
rempli--;
return false;
}
}
if (rempli == 2) {
correction();
}
}

function correction() {
var score = 0;
        for (var i=0; i<nbquestions; i++) {
                var proposition = document.getElementsByName("prop");
                imput_prop = proposition[i];
                if (imput_prop.value == reponse[i]) {
                        score++;        //augmente le score d'1 point
                        var images_vrai = document.getElementsByName("vrai");
                        img_vrai = images_vrai[i];
                        img_vrai.style.display="inline";                          //affiche l'image "vrai"
                        var solution = document.getElementsByName("solution");
                        imput_solution = solution[i];
                        imput_solution.value = "("+reponse[i]+")";                //affiche la solution
                        imput_solution.style.display = "inline";                //affiche le bouton "solution"
                        imput_solution.style.color = "#00CC00";                        //colore le texte en vert
                }
                else {
                        var images_faux = document.getElementsByName("faux");
                        img_faux = images_faux[i]
                        img_faux.style.display="inline";                        //affiche l'image "faux"
                        var solution = document.getElementsByName("solution");
                        imput_solution = solution[i];
                        imput_solution.value = "("+reponse[i]+")";                //affiche la solution
                        imput_solution.style.display = "inline";                //affiche le bouton "solution"
                        imput_solution.style.color = "#FF0000";                        //colore le texte en rouge
                }
        }
        document.getElementById("total").value= score+"/"+nbquestions;                //affiche le score dans le boutton "total"
        for (var i=0; i<nbquestions; i++) {
                var proposition = document.getElementsByName("prop");
                imput_prop = proposition[i];
                imput_prop.disabled = true;                                        //empêche la modification des données des boutons "prop"
        }
}

function efface() {
                location.reload();                                                //recharge la page
                return(false);
}
</script>

</head>

<body>

<p>Compléter avec le verbe conjugué :</p>

<form id="questions">
  <p><img name="vrai" border="0" src="images/vrai.jpg" width="20" height="20" id="image1_1" style="display:none"><img name="faux" border="0" src="images/faux.jpg" width="20" height="20" id="image1_2" style="display:none">    1.Il <input name="prop" type="text" id="button1" size="10"><input name="solution" style="display:none;font-weight:bold;border:none" type="text" id="button1" size="5" readonly="readonly"> (être) pompier.</p>
  <p><img name="vrai" border="0" src="images/vrai.jpg" width="20" height="20" id="image2_1" style="display:none"><img name="faux" border="0" src="images/faux.jpg" width="20" height="20" id="image2_2" style="display:none">    2.Je <input name="prop" type="text" id="button2" size="10"><input name="solution" style="display:none;font-weight:bold;border:none" type="text" id="button1" size="5" readonly="readonly"> (être) sous la douche.</p>
</form>
<form id="questionnaire">
  <p><input id="corriger" type="button" value="CORRIGER" onClick="CheckInput();">
  <input id="effacer" type="button" value="EFFACER" onClick="efface()"></p>
  <p>Votre score : <input type="text" id="total" readonly="readonly" size="1"></p>



</body>

</html>

Normalement cela devrait marcher ...
Commentaire de routry le 13/05/2007 20:01:24

Bonsoir Laffrey,

Je te confirme que cela fonctionne et je t'en remercie.

Je test autre chose qui permettrai de déclencher l'ouverture d'une popup UNIQUEMENT quand le resultat s'affiche. Aurais-tu une idée ?

<p><input id="corriger" type="button" value="CORRIGER" onClick="CheckInput(); window.open('popup.htm','popup','width=300,height=200,toolbar=false,scrollbars=false')">
Commentaire de Laffrey le 14/05/2007 07:57:52

Salut ROUTRY,

J'ai une idée mais je ne suis pas sur d'avoir tout compris sur ce que tu veut faire :

function CheckInput() {
var rempli = 2
for(i=0; i<nbquestions; ++i){
                var proposition = document.getElementsByName("prop");
                imput_prop = proposition[i];
   if(imput_prop.value == "")  {
     alert("Tous les champs n'ont pas été remplis!");
rempli--;
return false;
}
}
if (rempli == 2) {
correction();
        window.open('popup.htm','popup','width=300,height=200,toolbar=false,scrollbars=false')
}
}

Est-ce cela ???
Commentaire de routry le 14/05/2007 22:27:10

Bonsoir Laffrey,

C'est exactement cela que je désirai, je te remercie infiniment pour tout.
Je t'enverrai prochainement le lien, tu seras très surpris de ce que j'ai pu mettre au point avec ton script.

Merci encore

Cordialement
Routry
Commentaire de marial le 04/06/2007 18:14:41

Salut Laffrey!

Merci beaucoup pour ton code et je cherchais un Quiz pareil pour l'utilisation sur mon site et le tien m'aidera beaucoup je n'oublierai point de te faire découvrir les bienfaits de ton code.
Marial
Commentaire de marial le 04/06/2007 18:41:39

Resalut Laffrey!

Ton code marche impécablement sur Internet Explorer mais lorsque
je l'executer sur Firefox et bonjour le bordel, il ne fonctionne plus
enfin c'est le bouton EFFACER qui ne joue pas son rôle.
Peux-tu me dire à quoi cela est-il dû? c'est tout de même ennuyeux
de voir les visiteurs sur mon site ne pouvant pas profiter de mon Quizz
surtout s'ils navigent avec Mozilla Firefox.
Merci pour ta réponse.
Marial
Commentaire de Laffrey le 05/06/2007 09:29:08

Salut Marial,
Pour le problème, c'est que Firefox ne recharge pas complètement la page. Il faut lui présiser de rendre à nouveau possible la sélection sur tout les bouttons et d'effacer leurs contenus. Voici ce que cela donne pour la fonction efface() :

function efface() {
for (var i=0; i<nbquestions; i++) {
var proposition = document.getElementsByName("prop");
imput_prop = proposition[i];
imput_prop.disabled = false; //rend possible la modification des données des boutons "prop" (pour Firefox)
imput_prop.value=""; //efface le contenu des bouttons
}
document.getElementById("total").value=""; //remet le boutton "total" à 0 (pour Firefox)
location.reload(); //recharge la page
return(false);

}

Normalement, cela devrait marcher...
Commentaire de marial le 05/06/2007 15:31:53

Salut Laffrey!

merci maintenant tout est ok sur Firefox apres avoir validé, le bouton effacer reactualise et recharge le contenu des champs.
Merci c'est pratique maintenant sur IE et FM.

A très bientôt

Marial