www.webdeveloper.com
Results 1 to 2 of 2

Thread: [RESOLVED] Allow two attempts at a question (JS quiz)

  1. #1
    Join Date
    May 2014
    Posts
    2

    resolved [RESOLVED] Allow two attempts at a question (JS quiz)

    I was looking for a way in which to allow someone to have two attempts at a question in a JS quiz, and found this old thread: http://www.webdeveloper.com/forum/sh...ith-short-quiz which was posted over a year ago, with it ending with the issue that the user that two "lives" overall rather than two attempts at a question, and no response. The code is below:
    PHP Code:
    var total 3
    var 
    score 0
    var 
    correct 1

    //array list with questions & answers 
    var questions = [ 
        [
    'What is the capital of England?''London'],   
        [
    'What is the capital of Scotland?''Edinburgh'], 
        [
    'What do you call a baby cat?''Kitten'
    ]; 
    function 
    askQuestion(question//calling the function 


        var 
    answer prompt(question[0], ""); //using prompt to pull question from array and assing users answer to var 
            
    if (answer == question[1]) //if statement checking if answer = answer pulled from array list 
            

                
    alert("Correct! " "You have scored " correct " out of " total); 
                
    score++; 
                
    correct++ 
            } 
            else 
            { 
                
    alert("Sorry. The correct answer is " question[1]); 
            } 


    for (var 
    0questions.lengthi++) // counter which will end loop after 3 questions answered.  


    askQuestion(questions[i]); // indexing the array for the next question to be pulled 


    document.writeln("Well done! Your final score is " score " out of " total); 
    So rather than posting on a dead thread, I'm hoping that one of you can help me out- should be an easy fix. Thanks!

  2. #2
    Join Date
    May 2014
    Posts
    2
    Got it:

    <!DOCTYPE html>
    <html>
    <head>
    <title>Quiz</title>
    </head>
    <body>
    <form>
    <label for="answer" id="question"></label>
    <input type="text" id="answer"/>
    <input type="submit" value="Answer"/>
    </form>
    <div id="response">
    </div>
    <script>
    var questions = [
    {
    "question":"What is the capital of England?",
    "answer":"London"
    },
    {
    "question":"What is the capital of Australia?",
    "answer":"Canberra"
    },
    {
    "question":"What do you call a baby cat?",
    "answer":"Kitten"
    }
    ];
    var attempt = 1;
    var score = 0;
    var questionNum = 0;
    var questionField = document.getElementById('question');
    var text = document.getElementById('answer');
    var response = document.getElementById('response');
    document.getElementsByTagName('form')[0].addEventListener('submit',checkAnswer);
    loadQuestion(questionNum);
    function loadQuestion(num) {
    questionField.innerHTML = questions[num].question;
    attempt = 1;
    }

    function checkAnswer(e) {
    var answer = text.value;
    if(answer == questions[questionNum].answer && attempt <= 2) {
    score++;
    if(questionNum < questions.length) {
    console.log('test');
    questionNum++;
    }
    if(questionNum !== questions.length) {
    loadQuestion(questionNum);
    response.innerHTML = "correct, score: "+score;
    } else {
    response.innerHTML = "correct, final score: "+score;
    }

    } else if(attempt < 2) {
    attempt++;
    response.innerHTML = "Wrong, please try again";
    } else if(attempt >=2 ) {
    attempt++;
    response.innerHTML = "Ran out of tries final score: "+score;
    }
    e.preventDefault();
    }
    </script>
    </body>
    </html>

Thread Information

Users Browsing this Thread

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

Tags for this Thread

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