Javascript Quiz cu 10 intrebari aleatorii

Aici postaţi orice este legat de tehnologiile "client side". HTML, HTML5, XHTML, CSS, CSS3, XML, Standarde
Manual JS: http://www.phpromania.net/jsmanual/index.html

Moderatori: eyecon, Moderatori

Scrie răspuns
alex05ok
PHPRomania Supporter
Mesaje: 26
Membru din: Vin Sep 16, 2011 8:08 am

Javascript Quiz cu 10 intrebari aleatorii

Mesajde alex05ok » Joi Noi 14, 2013 8:50 pm

Buna ziua!

Am acest quiz cu 10 intrebari si afiseaza tot 10 intrebari.
Vreau sa mai adaug intrebari dar sa imi afiseze tot 10 intrebari la intamplare.

codul de mai jos este emulat aici
http://www.saiubesti.ro/download/quizenglish.html


Cod: Selectaţi tot

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>

<script LANGUAGE="JavaScript">
function scoreme()
{
<!--
 
var total=10               
var correct=total;         
 
 sa01 = document.FXY1.NA01.value.toUpperCase(); sb01 = document.FXY1.NB01.value.toUpperCase();
 
 if(sa01!=sb01) { document.FXY1.NB01.value="INCORRECT!"; correct=correct-1;}
 
 sa02 = document.FXY1.NA02.value.toUpperCase(); sb02 = document.FXY1.NB02.value.toUpperCase();
 if(sa02!=sb02) { document.FXY1.NB02.value="INCORRECT!"; correct=correct-1;}
 
 sa03 = document.FXY1.NA03.value.toUpperCase(); sb03 = document.FXY1.NB03.value.toUpperCase();
 if(sa03!=sb03) { document.FXY1.NB03.value="INCORRECT!"; correct=correct-1;}
 
 sa04 = document.FXY1.NA04.value.toUpperCase(); sb04 = document.FXY1.NB04.value.toUpperCase();
 if(sa04!=sb04) { document.FXY1.NB04.value="INCORRECT!"; correct=correct-1;}
 
 sa05 = document.FXY1.NA05.value.toUpperCase(); sb05 = document.FXY1.NB05.value.toUpperCase();
 if(sa05!=sb05) { document.FXY1.NB05.value="INCORRECT!"; correct=correct-1;}
 
 sa06 = document.FXY1.NA06.value.toUpperCase(); sb06 = document.FXY1.NB06.value.toUpperCase();
 if(sa06!=sb06) { document.FXY1.NB06.value="INCORRECT!"; correct=correct-1;}
 
 sa07 = document.FXY1.NA07.value.toUpperCase(); sb07 = document.FXY1.NB07.value.toUpperCase();
 if(sa07!=sb07) { document.FXY1.NB07.value="INCORRECT!"; correct=correct-1;}
 
 sa08 = document.FXY1.NA08.value.toUpperCase(); sb08 = document.FXY1.NB08.value.toUpperCase();
 if(sa08!=sb08) { document.FXY1.NB08.value="INCORRECT!"; correct=correct-1;}
 
 sa09 = document.FXY1.NA09.value.toUpperCase(); sb09 = document.FXY1.NB09.value.toUpperCase();
 if(sa09!=sb09) { document.FXY1.NB09.value="INCORRECT!"; correct=correct-1;}
 
 sa10 = document.FXY1.NA10.value.toUpperCase(); sb10 = document.FXY1.NB10.value.toUpperCase();
 if(sa10!=sb10) { document.FXY1.NB10.value="INCORRECT!"; correct=correct-1;}
 
 document.FXY1.ovrXX.value="You got " + correct + " out of " + total + " correct.";
 
-->
}
</script>

</head>

<body>

<FONT face=arial>
 

<BR><BR><hr>
<FORM name=FXY1>
 
Question 1
<INPUT value="answer1" name=NA01 type=hidden><INPUT class=ipxa value="" name=NB01 type=text size=15>
<BR><BR>

Question 2

<INPUT value="answer2" name=NA02 type=hidden><INPUT class=ipxa value="" name=NB02 type=text size=15>
 <BR><BR>

Question 3
 
<INPUT value="answer3" name=NA03 type=hidden><INPUT class=ipxa value="" name=NB03 type=text size=15>
 <BR><BR>

Question 4
 
<INPUT value="answer4" name=NA04 type=hidden><INPUT class=ipxa value="" name=NB04 type=text size=15>
<BR><BR>

Question 5

<INPUT value="answer5" name=NA05 type=hidden><INPUT class=ipxa value="" name=NB05 type=text size=15>
 <BR><BR>

Question 6
 
<INPUT value="answer6" name=NA06 type=hidden><INPUT class=ipxa value="" name=NB06 type=text size=15>
 <BR><BR>

Question 7
 
<INPUT value="answer7" name=NA07 type=hidden><INPUT class=ipxa value="" name=NB07 type=text size=15>,
 <BR><BR>

Question 8
 
<INPUT value="answer8" name=NA08 type=hidden><INPUT class=ipxa value="" name=NB08 type=text size=15>
 <BR><BR>

Question 9
 
<INPUT value="answer9" name=NA09 type=hidden><INPUT class=ipxa value="" name=NB09 type=text size=15>
<BR><BR>

Question 10

<INPUT value="answer10" name=NA10 type=hidden><INPUT class=ipxa value="" name=NB10 type=text size=15>.
 
<BR><BR>
 
<INPUT value="CHECK ALL" name=check type=button onclick=scoreme()> <INPUT class=ipxx value name=ovrXX type=text size=28>
</FORM>
 
<br></font>

</body>
</html>


Sus
alex05ok
PHPRomania Supporter
Mesaje: 26
Membru din: Vin Sep 16, 2011 8:08 am

Re: Javascript Quiz cu 10 intrebari aleatorii

Mesajde alex05ok » Joi Noi 14, 2013 8:51 pm

Multumesc anticipat!
Sus
elrukn
Average Member
Mesaje: 167
Membru din: Sâm Iul 28, 2007 11:16 pm
Localitate: Bucuresti

Re: Javascript Quiz cu 10 intrebari aleatorii

Mesajde elrukn » Joi Noi 14, 2013 9:07 pm

si astepti un om cu suflet mare sau un noob dornic de afirmare sa vina sa te ajute, nu ?

copy-paste FTW !?
Sus
alex05ok
PHPRomania Supporter
Mesaje: 26
Membru din: Vin Sep 16, 2011 8:08 am

Re: Javascript Quiz cu 10 intrebari aleatorii

Mesajde alex05ok » Joi Noi 14, 2013 9:13 pm

eu nu vreau sa devin un expert in javascript. Vreau sa folosesc acest program non-profit in scopuri educationale si sa ajut si pe altii.
Stiu ca aici sunt oameni foarte buni in domeniu si nu le ia mai mult de cateva minute sa scrie cateva linii de cod sau macar sa imi dea o idee daca se poate face.
Am scris si pe forumuri straine si cativa oameni s-au oferit sa ma ajute.
Sus
elrukn
Average Member
Mesaje: 167
Membru din: Sâm Iul 28, 2007 11:16 pm
Localitate: Bucuresti

Re: Javascript Quiz cu 10 intrebari aleatorii

Mesajde elrukn » Joi Noi 14, 2013 9:53 pm

in continuare imi lasi aceeasi impresie...

poti sa incerci sa faci sa faci asa:

- un array cu 20 de "obiecte"

putina documentatie pentru array javascript
...si pentru obiecte

Cod: Selectaţi tot

var youJustLazy = new Array();

youJustLazy[0] = {question: "que hora es?", answer:"ocho!"};
youJustLazy[1] = {question: "donde esta la biblioteca?", answer:"si!"};

// si asa mai departe


- shuffle array-ului cu intrebari, ca sa fie "random"

- afisezi primele 10
In functie de cum vrei sa le folosesti, trebuie sa tii cont de indexul intrebarii, ca sa poti sa verifici raspunsul

Cod: Selectaţi tot

// sa presupunem ca index = indexul intrebarii si userAnswer este raspunsul introdus de utilizator.

function checkAnswer(index, userAnswer)
{
   if (youJustLazy[index].answer == userAnswer)
      return true;
   
   return false;
}
Sus
Avatar utilizator
virus
Average Member
Mesaje: 153
Membru din: Dum Feb 27, 2011 3:16 pm
Localitate: Timisoara
Contact:
Contactează pe virus

Re: Javascript Quiz cu 10 intrebari aleatorii

Mesajde virus » Joi Noi 14, 2013 11:51 pm

Cod: Selectaţi tot

<!--
Alexandru Berce (Virus)
Quiz Script for phpromania:
http://www.phpromania.net/forum/viewtopic.php?t=27681
-->
<html>
<head>
   <style>
      .corect {color:green;}
      .incorect {color:red;}
   </style>
   <script src="http://code.jquery.com/jquery-latest.min.js"
        type="text/javascript"></script>
   <script>
      function shuffle(array) {
         var currentIndex = array.length, temporaryValue, randomIndex;

         // While there remain elements to shuffle...
         while (0 !== currentIndex) {
            // Pick a remaining element...
            randomIndex = Math.floor(Math.random() * currentIndex);
            currentIndex -= 1;

            // And swap it with the current element.
            temporaryValue = array[currentIndex];
            array[currentIndex] = array[randomIndex];
            array[randomIndex] = temporaryValue;
         }

         return array;
      }
      
      var array_intrebari = new Array();
      array_intrebari [0] = {question : "Number 1" , answer: "1"};
      array_intrebari [1] = {question : "Number 2" , answer: "2"};
      array_intrebari [2] = {question : "Number 3" , answer: "3"};
      array_intrebari [3] = {question : "Number 4" , answer: "4"};
      array_intrebari [4] = {question : "Number 5" , answer: "5"};
      array_intrebari [5] = {question : "Number 6" , answer: "6"};
      array_intrebari [6] = {question : "Number 7" , answer: "7"};
      array_intrebari [7] = {question : "Number 8" , answer: "8"};
      array_intrebari [8] = {question : "Number 9" , answer: "9"};
      array_intrebari [9] = {question : "Number 10" , answer: "10"};
      array_intrebari [10] = {question : "Number 11" , answer: "11"};
      array_intrebari [11] = {question : "Number 12" , answer: "12"};
      array_intrebari [12] = {question : "Number 13" , answer: "13"};
      array_intrebari [13] = {question : "Number 14" , answer: "14"};
      array_intrebari [14] = {question : "Number 15" , answer: "15"};
      
      
      //console.log(array_intrebari);
      array_intrebari = shuffle(array_intrebari);
      $(document).ready(function(){
         for (var i = 0 ; i <=10; i++)
            $("#quiztable").append("<tr><td>"+array_intrebari[i]['question']+"</td><td><input type='text' class='answer' /><span class='label'></span></td></tr>");
            
         $("#quiztable").append("<tr><td></td><td><input type='button' id='checkAnswers' value='Verifica!' /></td></tr>");
      
         $("#checkAnswers").click(function(){
            i = 0;
            $(".answer").each(function(){
               if ($(this).val() == array_intrebari[i]['answer'])
                  $(this).closest("tr").find("span").removeClass("incorect").addClass("corect").html("Corect!");
               else
                  $(this).closest("tr").find("span").removeClass("corect").addClass("incorect").html("Incorect!");
               i++;
            });
         });
      
      });
      
      
      
   </script>
</head>
<body>
   <div id="quiz">
      <table id="quiztable">
      </table>
   </div>
</body>
</html>


Intrebarile si raspunsurile ar trebui sa le iei dintr-o baza de date.
Nu este foarte greu sa dai un view source la pagina si sa vezi raspunsurile :))
echo ($busy === TRUE) ? "F**k Off" : "Hello. Can I help You?" ;
Sus
alex05ok
PHPRomania Supporter
Mesaje: 26
Membru din: Vin Sep 16, 2011 8:08 am

Re: Javascript Quiz cu 10 intrebari aleatorii

Mesajde alex05ok » Vin Noi 15, 2013 9:30 am

virus scrie:

Cod: Selectaţi tot

<!--
Alexandru Berce (Virus)
Quiz Script for phpromania:
http://www.phpromania.net/forum/viewtopic.php?t=27681
-->
<html>
<head>
   <style>
      .corect {color:green;}
      .incorect {color:red;}
   </style>
   <script src="http://code.jquery.com/jquery-latest.min.js"
        type="text/javascript"></script>
   <script>
      function shuffle(array) {
         var currentIndex = array.length, temporaryValue, randomIndex;

         // While there remain elements to shuffle...
         while (0 !== currentIndex) {
            // Pick a remaining element...
            randomIndex = Math.floor(Math.random() * currentIndex);
            currentIndex -= 1;

            // And swap it with the current element.
            temporaryValue = array[currentIndex];
            array[currentIndex] = array[randomIndex];
            array[randomIndex] = temporaryValue;
         }

         return array;
      }
      
      var array_intrebari = new Array();
      array_intrebari [0] = {question : "Number 1" , answer: "1"};
      array_intrebari [1] = {question : "Number 2" , answer: "2"};
      array_intrebari [2] = {question : "Number 3" , answer: "3"};
      array_intrebari [3] = {question : "Number 4" , answer: "4"};
      array_intrebari [4] = {question : "Number 5" , answer: "5"};
      array_intrebari [5] = {question : "Number 6" , answer: "6"};
      array_intrebari [6] = {question : "Number 7" , answer: "7"};
      array_intrebari [7] = {question : "Number 8" , answer: "8"};
      array_intrebari [8] = {question : "Number 9" , answer: "9"};
      array_intrebari [9] = {question : "Number 10" , answer: "10"};
      array_intrebari [10] = {question : "Number 11" , answer: "11"};
      array_intrebari [11] = {question : "Number 12" , answer: "12"};
      array_intrebari [12] = {question : "Number 13" , answer: "13"};
      array_intrebari [13] = {question : "Number 14" , answer: "14"};
      array_intrebari [14] = {question : "Number 15" , answer: "15"};
      
      
      //console.log(array_intrebari);
      array_intrebari = shuffle(array_intrebari);
      $(document).ready(function(){
         for (var i = 0 ; i <=10; i++)
            $("#quiztable").append("<tr><td>"+array_intrebari[i]['question']+"</td><td><input type='text' class='answer' /><span class='label'></span></td></tr>");
            
         $("#quiztable").append("<tr><td></td><td><input type='button' id='checkAnswers' value='Verifica!' /></td></tr>");
      
         $("#checkAnswers").click(function(){
            i = 0;
            $(".answer").each(function(){
               if ($(this).val() == array_intrebari[i]['answer'])
                  $(this).closest("tr").find("span").removeClass("incorect").addClass("corect").html("Corect!");
               else
                  $(this).closest("tr").find("span").removeClass("corect").addClass("incorect").html("Incorect!");
               i++;
            });
         });
      
      });
      
      
      
   </script>
</head>
<body>
   <div id="quiz">
      <table id="quiztable">
      </table>
   </div>
</body>
</html>


Intrebarile si raspunsurile ar trebui sa le iei dintr-o baza de date.
Nu este foarte greu sa dai un view source la pagina si sa vezi raspunsurile :))



Multumesc mult!
Este foarte aproape de ce vreau eu.
Sus
alex05ok
PHPRomania Supporter
Mesaje: 26
Membru din: Vin Sep 16, 2011 8:08 am

Re: Javascript Quiz cu 10 intrebari aleatorii

Mesajde alex05ok » Vin Noi 15, 2013 10:05 am

Sper ca nu cer prea mult dar vreau ca intrebarile sa fie sub forma de imagine ca sa adaug formule matematice in ele.

Multumesc anticipat!
Sus
elrukn
Average Member
Mesaje: 167
Membru din: Sâm Iul 28, 2007 11:16 pm
Localitate: Bucuresti

Re: Javascript Quiz cu 10 intrebari aleatorii

Mesajde elrukn » Vin Noi 15, 2013 9:21 pm

Si a aparut si acel om cu suflet mare, sa te ajute, OMG!

"9. Nu cereti scripturi, nu cereti chestii gratuite, aici nu avem asa ceva, aici oferim solutii, idei si sfaturi de programare, nu cod pentru lenesi.
Pentru asa ceva cautati pe hotscripts.com sau site-uri similare "

Penibil si trist... Dar ce sa faci cand simti nevoia sa arati ca tu stii si poti ?!
Sus
Scrie răspuns

Înapoi la “HTML/JavaScript/CSS”

Cine este conectat

Utilizatori ce ce navighează pe acest forum: Niciun utilizator înregistrat și 23 vizitatori