Sujet Précédent Sujet Suivant

QCM en javascript

Fermé
garig - 19 juin 2009 à 02:48
 garig - 9 févr. 2015 à 16:16
Bonjour,

Je suis débutant en javascript.

Voila je voudrai simplement faire quelquechose de très simple en javascript:

Poser une question et proposer 3 reponses (checkbox). Donner 1 point si la reponse est bonne !

<form name="quizz">
Quelle est la capitale de Hawai ?<br>
<input type="checkbox" name="reponse" value="1">Papeete<br>
<input type="checkbox" name="reponse" value="2">Nouméa<br>
<input type="checkbox" name="reponse" value="3">Honolulu<br>
<input type="submit" value="Voir les réponses" size="20" onSubmit="score();">
</form>

et voici la fonction que j ai créée:

Function score()
var reponse, score
score=0
if (document.quizz.reponse.value=="3")
{score=score+1;
alert("vous avez bon !")
}
else{
score=score;
alert("Recommencez...")
}


Et ça ne fonctionne pas... Quelqu'un pourrait m'aider svp?

Merci beaucoup de votre aide.

11 réponses

Réponse 1 / 11
garig
19 juin 2009 à 03:40
Tiens c'est marrant ton site avec marqué Honolulu justement lol :)

Oui j'aimerai bien que tu me le fasse, je désepsère un peu la... Merci de ton aide Templier Nocturne !

Voici la derniere version de mon code (avec quelques modif supplémentaires) qui ne marche toujours pas d'ailleurs...

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Quizz</title>
<script language="javascript" type="text/javascript">
function score()
var reponse, score;
score=0;
if (document.quizz.reponse1.value=="3") {
score=score+1;
alert("Vous avez '+score+' point");
}
else {
score=score;
alert("Vous avez '+score+' point");
}
</script>
</head>

<body>
<form name="quizz" onClick="score();">
Quelle est la capitale de Hawai?<br>
<input type="checkbox" name="reponse1" value="1">Papeete<br>
<input type="checkbox" name="reponse1" value="2">Nouméa<br>
<input type="checkbox" name="reponse1" value="3">Honolulu<br>
<br>
<input type="button" value="Mon score" size="20" onClick="score();">
</form>
</body>
</html>
3
Réponse 2 / 11
Templier Nocturne Messages postés 7734 Date d'inscription jeudi 22 janvier 2009 Statut Membre Dernière intervention 21 mai 2016 1 101
19 juin 2009 à 14:30
voila :) 

<html>
 <head>
 <title>Quizz</title>
 <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
 </head>
 <body>
 <script type="text/javascript">

 var q1= 0;//une variable par question
 var q2= 0;
 var q3= 0;


 //calcul du score
 function calcul() {score=q1+q2+q3+q4+q5+q6;}//une variable par question

 //commentaire du résultat
 function resultat() {calcul();
 if (score>2) {alert("Ton score est de "+score+" , bravo !!!!");}// if (score>2) définie les conditions de score
 else {alert("Ton score est de "+score+". Ce sera mieux la prochain fois ;)");}
 }

 </script>

 <div align="center"><br><big style="font-style: italic;"><font style="font-family: Arial; font-weight: bold; color: rgb(102, 51, 102);">prêt pour quelques questions ???</font></big></div>
 </div>

 <form><p>
 <!--Mise en forme de tout le texte sauf Question X-->
 <font face="Verdana, Arial, Helvetica, sans-serif" size="2">

 <hr align="center" noshade="noshade"> <p><font style="color: rgb(102, 51, 102);" face="Verdana, Arial, Helvetica, sans-serif" size="2"><b>Question 1 :</b></font>
 <br>intitulé<br>
 <input type="radio" name="choix1" onclick='q1=2'>1ere posibilité<br><!--le joueur gagne 2 points -->
 <input type="radio" name="choix1" onclick='q1=0'>2eme posibilité<br><!--le joueur gagne 0 points -->


 <p>
 <hr align="center" noshade="noshade"> <p><font style="color: rgb(102, 51, 102);" face="Verdana, Arial, Helvetica, sans-serif" size="2"><b>Question 2 :</b></font>
 <br>intitulé<br>
 <input type="radio" name="choix2" onclick='q2=2'>1ere posibilité<br>
 <input type="radio" name="choix2" onclick='q2=0'>2eme posibilité<br>
 <input type="radio" name="choix2" onclick='q2=0'>3eme posibilité<br>
<!--tu peux mettre autant de réponses que tu veux-->


 <p align="center">
 <input name="Submit" value="score ?" onclick="resultat()" type="button"></p>
 </form>

 </body></html>
1
garig
9 févr. 2015 à 16:16
ton bouille templier nocturne
0
Réponse 3 / 11
garig
19 juin 2009 à 03:18
re

J'ai modifié un peu... mais ça marche toujours pas
<html>
<head>
<title>Quizz</title>
<script language="javascript" type="text/javascript">
function score()
var reponse, score;
if (document.quizz.reponse1.value=="3") {
score=score+1;
alert("Bravo!"};
}
else {
score=score;
alert("Recommencez");
}
</script>
</head>

<body>
<form name="quizz" onClick="score();">
Quelle est la capitale de Hawai ?<br>
<input type="checkbox" name="reponse1" value="1">Papeete<br>
<input type="checkbox" name="reponse1" value="2">Nouméa<br>
<input type="checkbox" name="reponse1" value="3">Honolulu<br>
<br>
<input type="submit" value="Voir les réponses" size="20" onClick="score();">
</form>
</body>
</html>

Aidez moi svp

Merci ! :)
0
Réponse 4 / 11
Templier Nocturne Messages postés 7734 Date d'inscription jeudi 22 janvier 2009 Statut Membre Dernière intervention 21 mai 2016 1 101
19 juin 2009 à 03:27
tien, en espérant que ça t'aide (sinon, je te le ferais ;) )

http://www.creation-du-web.com/honolulu/cours-html-javascript-anglais.html
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Réponse 5 / 11
garig
19 juin 2009 à 04:36
Merci pour ton site. ça m aide un peu. Mais vu que je debute ça reste assez flou pour moi.

Vous pensez qu'il vaut mieux utiliser checkbox ou radio pour un QCM en javascript ?

Merci pour vos réponses.
0
Réponse 6 / 11
Templier Nocturne Messages postés 7734 Date d'inscription jeudi 22 janvier 2009 Statut Membre Dernière intervention 21 mai 2016 1 101
19 juin 2009 à 13:36
radio est mieux si tu ne met qu'une possibilité

checkbox permet de donner plusieurs réponses

pour ton QCM, je m'y colle ^^
0
Réponse 7 / 11
nEm3sis Messages postés 710 Date d'inscription lundi 20 août 2007 Statut Membre Dernière intervention 9 avril 2012 113
19 juin 2009 à 15:40
j'ai repris et corrigé ton code Templier Nocturne (tu utilise un programme qui te fait ton code html ? ) 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<title>Quizz</title>
	<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"/>
	<script type="text/javascript">
	//<![CDATA[
		var nombre_question;
		var q;
		window.onload = function(){
			nombre_question=document.getElementsByClassName('question').length;
			q = new Array( nombre_question+1 );
			for( i=1, score=0; i<=nombre_question; i++ ) q[i] = 0; //  on met tout les score a 0
		}
		//calcul du score
		function calcul() {
			for( i=1, score=0; i<=nombre_question; i++ )
				score += q[i];
			return score;
		}

		//commentaire du résultat
		function resultat() {
			score = calcul();
			if ( score > 2 ) alert("Ton score est de "+score+" , bravo !!!!");
			else alert("Ton score est de "+score+". Ce sera mieux la prochain fois ;)");
		}
	//]]>
	</script>
	<style type="text/css">
		body{
			font-family:Verdana, Arial, Helvetica, sans-serif;
			font-size:small;
		}
		.titre{
			font-family: Arial; font-weight: bold;
			color: rgb(102, 51, 102);
			font-size:large;
			font-style:italic;
		}
		.question{
			color: rgb(102, 51, 102);
		}
	</style>
</head>
<body>
	<div align="center">
		<br/>
		<font class="titre">prêt pour quelques questions ???</font>
	</div>
	<div>
		<hr align="center" noshade="noshade"/>
		<font class="question"><b>Question 1 :</b></font>
		<br/>intitulé de la question<br/>
		<label><input name="question1" type="radio" onclick='q[1]=2'/>1ere posibilité</label><br/><!--le joueur gagne 2 points -->
		<label><input name="question1" type="radio" onclick='q[1]=0'/>2eme posibilité</label><br/><!--le joueur gagne 0 points -->

		<hr align="center" noshade="noshade"/>
		<font class="question"><b>Question 2 :</b></font>
		<br/>intitulé de la question<br/>
		<label><input name="question2" type="radio" onclick='q[2]=2'/>1ere posibilité</label><br/>
		<label><input name="question2" type="radio" onclick='q[2]=0'/>2eme posibilité</label><br/>
		<label><input name="question2" type="radio" onclick='q[2]=0'/>3eme posibilité</label><br/>
		<!--tu peux mettre autant de réponses que tu veux-->

		<p align="center">
			<input value="score ?" onclick="resultat()" type="button"/>
		</p>
	</div>
</body>
</html>
0
Réponse 8 / 11
garig
19 juin 2009 à 16:01
SVP Je suis débutant et je ne comprend pas encore les Array Nem3sis.

C'est pour cela que le code de Templier me semblait très bien en utilisant les Radio ! :)

J'ai donc adapté le code de Templier dans mon vrai QCM. Vous allez voir les questions son très sympa !

Malheuresement il me manque encore quelque chose pour le faire marcher...

Si vous pouvez m'aider a faire marcher mon QCM ça serait très sympa ! Merci de votre aide les pros !

<div style="margin-left:10px;margin-right:10px">
<h2 align="center" color="navy">Quizz sur les îles</h2>
<p>Testez vos connaissances sur les îles tropicales. Chaque question possède une seule bonne réponse !</p>

<form>

<p><font style="color: rgb(102, 51, 102);" face="Verdana, Arial, Helvetica, sans-serif" size="2"><b>Question 1 :</b></font>
<br>La République Dominicaine fait partie des :<br>
<input type="radio" name="choix1" onclick='q1=2'>Grandes Antilles<br><!--le joueur gagne 2 points -->
<input type="radio" name="choix1" onclick='q1=0'>Petites Antilles<br><!--le joueur gagne 0 points -->

<hr align="center"><p><font style="color: rgb(102, 51, 102);" face="Verdana, Arial, Helvetica, sans-serif" size="2"><b>Question 2 :</b></font>
<br>Quelle est la capitale de Hawai?<br>
<input type="radio" name="choix2" onclick='q2=2'>Honolulu<br><!--le joueur gagne 2 points -->
<input type="radio" name="choix2" onclick='q2=0'>Papeete<br><!--le joueur gagne 0 points -->
<input type="radio" name="choix2" onclick='q2=0'>Nouméa<br><!--le joueur gagne 0 points -->

<hr align="center"><p><font style="color: rgb(102, 51, 102);" face="Verdana, Arial, Helvetica, sans-serif" size="2"><b>Question 3 :</b></font>
<br>Ou se trouve le volcan de la Souffrière?<br>
<input type="radio" name="choix3" onclick='q3=0'>Martinique<br><!--le joueur gagne 0 points -->
<input type="radio" name="choix3" onclick='q3=2'>Guadeloupe<br><!--le joueur gagne 2 points -->
<input type="radio" name="choix3" onclick='q3=0'>Réunion<br><!--le joueur gagne 0 points -->

<hr align="center"><p><font style="color: rgb(102, 51, 102);" face="Verdana, Arial, Helvetica, sans-serif" size="2"><b>Question 4 :</b></font>
<br>Ou trouve-t-on des plages de sable rouge?<br>
<input type="radio" name="choix3" onclick='q4=2'>Hwai<br><!--le joueur gagne 2 points -->
<input type="radio" name="choix3" onclick='q4=0'>Bora Bora<br><!--le joueur gagne 0 points -->
<input type="radio" name="choix3" onclick='q4=0'>Tahiti<br><!--le joueur gagne 0 points -->

<hr align="center"><p><font style="color: rgb(102, 51, 102);" face="Verdana, Arial, Helvetica, sans-serif" size="2"><b>Question 5 :</b></font>
<br>Ou trouve-t-on la plus grande barrière de corail au monde?<br>
<input type="radio" name="choix3" onclick='q5=0'>Maldives<br><!--le joueur gagne 2 points -->
<input type="radio" name="choix3" onclick='q5=2'>Nouvelles Calédonie<br><!--le joueur gagne 0 points -->
<input type="radio" name="choix3" onclick='q5=0'>Bahamas<br><!--le joueur gagne 0 points -->

<p align="center">
<input type="button" name="Submit" value="score ?" onclick="resultat();"></p>
</form>
</div>
0
Réponse 9 / 11
nEm3sis Messages postés 710 Date d'inscription lundi 20 août 2007 Statut Membre Dernière intervention 9 avril 2012 113
19 juin 2009 à 16:26
justement ça marche pas c'est pour ça que j'avais modifié son code (sans parler des fautes d'html)
je te l'ai refait sans tableau mais j'ai pas tout complété pour les texte :s
s'il y a quelque chose que tu ne comprend pas demande moi =)

comme ça commence a faire trop long je met un lien ailleurs
http://to.kc.free.fr/lab/a.txt
http://to.kc.free.fr/lab/a.html


tout ce que j'ai mis en haut t'en occupe pas c'est juste pour respecter bien la norme tu a juste a copier coller =)

les scripts sont entre 
	<script type="text/javascript">
	//<![CDATA[
et
	//]]>
	</script>

et la page est entre 
<body>
et
</body>
0
Réponse 10 / 11
garig
19 juin 2009 à 18:46
Je vais essayer d apprendre les array nem3sis

Je reposte si j ai un probleme.

En tout cas, ton script a l air vraiment pas mal Et je crois d'ailleurs que c est la bonne méthode pour faire les quizz. J'ai lu ça aussi ailleurs qu 'il fallait utiliser les array pour les quizz !

Merci beaucoup de ton aide
0
Réponse 11 / 11
nEm3sis Messages postés 710 Date d'inscription lundi 20 août 2007 Statut Membre Dernière intervention 9 avril 2012 113
22 juin 2009 à 02:51
ravi de t'aider =)

c'est vrai que les Array (tableau) c'est bien pratique car on peut mettre dedans autant de valeur qu'on veut donc autant de question qu'on veut sans avoir a modifier grand chose
0