Quiz complet et facilement personnalisable

Commenter

Contenu du snippet

Bonjour à tous.

Voici mon premier code source. Il n'est pas bien difficile, et très sincèrement, il est très facile à comprendre.
Il consiste tout simplement à répondre à 10 questions, ou plus, et à regarder le résultat. Le quiz est facilement personnalisable puisque vous pouvez (bien sûr) modifier son design. Il ne vous reste plus qu'à copier ce code et à le coller dans les balises <body> et </body>. Puis, vous pourrez modifier à votre guise les questions, les réponses et les messages d'alerte.

Merci de votre future indulgence pour un programmeur débutant.

Source / Exemple : 


<script language="JavaScript">
 
var rep = new Array;
var faite = new Array;
var score = 0;
 

rep[1] = "a"; // Ici, insérer les réponses aux questions posées.
rep[2] = "a";
rep[3] = "a";
rep[4] = "a";
rep[5] = "a";
rep[6] = "a";
rep[7] = "a";
rep[8] = "a";
rep[9] = "a";
rep[10] = "a";

function Engine(question, reponse) {
        if (reponse != rep[question]) {
                if (!faite[question]) {
                        faite[question] = -1;
                        alert("Mauvaise réponse ! Votre score est de : " + score + ".  La bonne reponse est la -" + rep[question] + "-");
                        }
                else {
                        alert("Vous avez déjà répondu à cette question !");
                        }
                }
        else {
                if (!faite[question]) {
                        faite[question] = -1;
                        score++;
                        alert("Bonne réponse ! Votre score est de " + score + " point(s) !");
                        }
                else { 
                        alert("Vous avez déjà répondu à cette question !");
                        }
                }
}
 
function NextLevel () {
        if (score >= 11) {
                alert("Ce n'est pas beau de tricher ! ");
                }
        if (score > 8 && score <11) {
                alert(score + "/10 " + "Bravo !") // La phrase-alerte qui félicite le joueur ayant un score de 10/10.
                self.location=""
                }
        if (score >= 6 && score <= 7) {
                alert(score + "/10 " + "- Pas mal, mais un peu d'entraînement ne ferait pas de mal !");
                }
        if (score >= 4 && score <= 5) {
                alert(score + "/10 " + "- C'est moyen...");
                }
        if (score >= 2 && score <= 3) {
                alert(score + "/10 " + "- Non, c'est pas encore ça... Vous avez du chemin à faire avant d'être incollable !");
                }
        if (score < 2) {
                alert(score + "/10 " + "- Eh bien, c'est catastrophique !" );
                }
 

faite = new Array;
score = 0;
document.quest.reset();
}

  </script>
                          <!-- Fin du script -->

                          <!-- Debut du questionnaire -->
                          <span class="Style2 Style19"><strong>Quiz</strong></span><font face="Verdana"><span style="font-size: 8pt;"><b><br />
                          </b></span></font><br />
                          <br />
                          <br />
                          <br />

                          <span class="Style1"><span class="Style16"><strong>- Question 1 </strong></span><br />
                          <font face="Verdana">
                          <input onclick="Engine(1, this.value)" value="a" name="1" type="radio"> 
                          a) Réponse a<br>
    <input onclick="Engine(1, this.value)" value="b" name="1" type="radio"> 
    b) Réponse b <br>
    <input onclick="Engine(1, this.value)" value="c" name="1" type="radio"> 
    c) Réponse c </font></span><font face="Verdana"><br />
                          <br>
                          <span class="Style1"><b>- Question 2 <br />
                          </b>
                          <input onclick="Engine(2, this.value)" value="a" name="2" type="radio">
                          a) Réponse a <br>
                          <input onclick="Engine(2, this.value)" value="b" name="2" type="radio">
                          b) Réponse b <br>
                          <input onclick="Engine(2, this.value)" value="c" name="2" type="radio">
                          c) Réponse c </span></font>
                         <p align="left" class="Style1"><font face="Verdana"><b>- Question 3 <br />
  </b>
         <input onclick="Engine(3, this.value)" value="a" name="3" type="radio">
         a) a <br>
         <input onclick="Engine(3, this.value)" value="b" name="3" type="radio">
          b) b <br>
          <input onclick="Engine(3, this.value)" value="c" name="3" type="radio">
   c) c </font></p>
                         <p align="left" class="Style1"><font face="Verdana"><b>- Question 4</b><br>
        <input onclick="Engine(4, this.value)" value="a" name="4" type="radio"> 
  a) a <br>
  <input onclick="Engine(4, this.value)" value="b" name="4" type="radio"> 
  b) b <br>
  <input onclick="Engine(4, this.value)" value="c" name="4" type="radio">
   c) c </font></p>
                         <p align="left" class="Style1"><font face="Verdana"><b>- Question 5 <br />
  </b>
      <input onclick="Engine(5, this.value)" value="a" name="5" type="radio"> 
    a) a <br>
    <input onclick="Engine(5, this.value)" value="b" name="5" type="radio">
     b) b<br>
     <input onclick="Engine(5, this.value)" value="c" name="5" type="radio">
     c) c </font></p>
                         <p align="left" class="Style1"><font face="Verdana"><b>;- Question 6 <br />
  </b>
         <input onclick="Engine(6, this.value)" value="a" name="6" type="radio">
         a) a <br>
         <input onclick="Engine(6, this.value)" value="b" name="6" type="radio"> 
         b) b <br>
         <input onclick="Engine(6, this.value)" value="c" name="6" type="radio">
          c) c </font></p>
                         <p align="left" class="Style1"><font face="Verdana"><b> - Question 7 <br />
  </b>
         <input onclick="Engine(7, this.value)" value="a" name="7" type="radio">
         a) a <br>
         <input onclick="Engine(7, this.value)" value="b" name="7" type="radio">
          b) b <br>
          <input onclick="Engine(7, this.value)" value="c" name="7" type="radio">
           c) c </font></p>
                         <p align="left" class="Style1"><font face="Verdana"><b>8 - Question 8 <br />
  </b>
      <input onclick="Engine(8, this.value)" value="a" name="8" type="radio">
         a) a <br>
         <input onclick="Engine(8, this.value)" value="b" name="8" type="radio">
          b) b<br>
          <input onclick="Engine(8, this.value)" value="c" name="8" type="radio">
           c) c</font></p>
                         <p align="left" class="Style1"><font face="Verdana"><b>- Question 9<br />
  </b>
      <input onclick="Engine(9, this.value)" value="a" name="9" type="radio">
         a) a <br>
         <input onclick="Engine(9, this.value)" value="b" name="9" type="radio">
          b) b <br>
          <input onclick="Engine(9, this.value)" value="c" name="9" type="radio">
           c) c </font></p>
                         <p align="left" class="Style1"><font face="Verdana"><b>- Question 10 <br />
  </b>
      <input onclick="Engine(10, this.value)" value="a" name="10" type="radio">
     a) a <br>
    <input onclick="Engine(10, this.value)" value="b" name="10" type="radio">
    b) b <br>
    <input onclick="Engine(10, this.value)" value="c" name="10" type="radio">
     c)  c <br>
     <!-- Fin du questionnaire -->
  </font></p>
  <p align="left"><font face="Verdana"><span style="font-size: 8pt;">
    <input name="Resultat" style="border: 1px dotted ; background: transparent none repeat scroll 0%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;" onclick="NextLevel()" value="Résultat" marginheight="0" marginwidth="0" leftmargin="0" topmargin="0" 0="" type="button">
  </span></font></p>
  <p align="left">
  <script language="JavaScript">
<!--
var SymRealOnLoad;
var SymRealOnUnload;

function SymOnUnload()
{
  window.open = SymWinOpen;
  if(SymRealOnUnload != null)
     SymRealOnUnload();
}

function SymOnLoad()
{
  if(SymRealOnLoad != null)
     SymRealOnLoad();
  window.open = SymRealWinOpen;
  SymRealOnUnload = window.onunload;
  window.onunload = SymOnUnload;
}

SymRealOnLoad = window.onload;
window.onload = SymOnLoad;

//-->
</script>

Conclusion :


Eh bien voilà, c'est fait. J'espère que ce code vous satisfaira. Pour le tester, vous pouvez aller sur http://thypot.free.fr/quiz.php

Je vous remercie d'avance pour vos commentaires constructifs.

A voir également

S'inscrire maintenant

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.