www.webdeveloper.com
Results 1 to 5 of 5

Thread: Javascript quiz

Hybrid View

  1. #1
    Join Date
    Jan 2011
    Posts
    1

    Javascript quiz

    Hey guys,

    I want to make a website to help my classmates and myself study for Latin. What I envision for now is a single-page site with a quiz component that would be written in javascript. And if you guys could provide me with some direction to go about starting this project, I would be very appreciative =D

    For now, I want to start with a quiz that asks for the English translation of random Latin words. All I would need is a text box where the user would type in the answer, a button to click, and all the machinery behind the scenes that would decides if the user has entered the correct answer, and then finally directing them to the next random question.

    I would need to construct a vast list of Latin words and their (often many) correct English definitions.

    And so if you guys could help get me started with that, I would <3 you all long time. Once I get the hang of everything, I should be well off by myself. I'm excited to get this **** started.

    Also, my experience with javascript is zero, and perhaps it isn't even the best language to build my idea. If there is a language that better suits this project, please let me know.

  2. #2
    Join Date
    Mar 2009
    Posts
    485
    This is a down and dirty primitive script that might show you the way. Its not fancy and its not pretty but it should give you a template to work from. Good luck. I don't envy you the typing involved.

    Code:
    <html>
    	<head>
    
    		<title>Untitled Document</title>
    <script type="text/javascript">
    var spanish = Array();
    var english = Array();
    var offset;
    
    function dL(sp, eng){  // this function is for entering the word pairs---see the windows.onload function below
       spanish.push(sp);
       english.push(eng);
    }
    
    function doSet(){  // this prepares the question
       var score, prompting, answer, txt;
       offset = Math.floor(Math.random()*(spanish.length + 1));  //get the random number
    
       if(offset >= spanish.length){  // make sure its not out of range
           doSet();
           return;
       }
     
       score = document.getElementById('score');  //here we kill off the old text and enter in the new for the question
    
       score.removeChild(score.firstChild);
       txt = document.createTextNode('What is the Spanish word for:');
       score.appendChild(txt);
       
       prompting = document.getElementById('prompting'); //put the word to be translated into the 'prompting' div
       prompting.removeChild(prompting.firstChild);
       txt = document.createTextNode(english[offset]);
       prompting.appendChild(txt);
    
       answer = document.getElementById('answer'); // empty out the text field  to make it blank
       answer.value = '';
    }
    
    function doCheck(){  // this checks the answer
       var x, y, score, txt;
    
       score = document.getElementById('score');
    
       score.removeChild(score.firstChild); // empty the 'score' div
       x= document.getElementById('answer');//read the value in the text input box
    
       if(x.value == spanish[offset]){  //react to the user input
         txt = "CORRECT!";
       }
       else{
         txt = "INCORRECT.  YOU ARE A POOR STUDENT INDEED. THIRTY LASHES";
       }
    
       txt = document.createTextNode(txt);
       score.appendChild(txt);  // display the output
    }
    
    window.onload = function(){
      //here is where you load in the data by using the dL function--you can add more word pairs as time permits
      dL('uno', 'one');
      dL('dos', 'two');
      dL('tres', 'three');
      
      doSet();
    }
      
           
       
       
    </script>
    	
    	</head>
    	<body>
    <div id = "score">filler</div><br />
    <div id ="prompting">Hello</div><br />
    <input type="text" id = "answer"/><br />
    <input type="button" onclick = "doCheck()" value="Check Answer" id="sendAnswer"/><br />
    <input type = "button" value="Next question" onclick="doSet()" />
    
    
    	</body>
    </html>

  3. #3
    Join Date
    Dec 2002
    Posts
    3

    Further Question

    This script looks like something I could use, but instead of having the child part of the question drop down, I would like it all to be on one line. Could you show me how that would work?

  4. #4
    Join Date
    Aug 2008
    Location
    Sweden
    Posts
    227
    In response to the further question in this veeeery old thread...

    Use <span> instead of <div>. div elements (or block elements) put line breaks before and after themselves by default while span elements (or inline elements) don't.

  5. #5
    Join Date
    Oct 2012
    Posts
    13
    I think <div> will work, but i m confused how will it put line breaks

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles