單選按鈕單擊事件

我遇到問題，我的if語句註冊正確的答案，一旦我點擊提交。無論我放在if語句中，它都會保持註冊不正確。有人可以幫忙嗎？ :)單選按鈕單擊事件

HTML：

<!-- This is the HTML portion of the code related to the Trivia Game.--> 

<!DOCTYPE html> 
    <html lang=""> 
    <head> 
     <meta charset="utf-8"> 
     <meta name="viewport" content="width=device-width, initial-scale=1"> 
     <title>Tim Decilveo's Trivia</title> 
     <link rel="stylesheet" type="text/css" href="assets/css/style.css" /> 
     <script type="text/javascript" src="https://code.jquery.com/jquery-3.1.1.js"></script> 
    </head> 
    <body> 
     <h1 id="trivia-game-header">Tim's Triple Trivia!</h1> 
     <p>The rules of the game are simple. Click the start button and begin the game! Watch the clock because the game is counting down!</p> 


     <button id = "start-button">Start</button> 

     <div id = "timer"></div> 
     <br> 
     <div id = "questionQ"></div> 

<!--  <div id = "submit-button"></div> --> 
     <button id = "submit-button">Submit</button> 


     <script type="text/javascript" src="assets/javascript/jquery.js"></script> 

    </body> 
</html>

的jQuery：

// use the 1-customer-object.html for the questions and answer section 
$(document).ready(function(){ 
    $("#submit-button").hide(); 
    $("#start-button").click(function() { 
     $("#start-button").hide(); 
     $("#submit-button").show(); 
     // $(this).parent().remove(); 

     // *** Timer that runs down to 0 *** 
     var number = 5000; 
     var intervalId; 

     var questions = { 
      questionsArray: [{ 
       question: "1) What is the fastest bird on foot?", 
       a: "Ostrich", 
       b: "Sparrow", 
       c: "Eagle", 
       d: "Woodpecker", 
      // }, 
      // { 
      // question: "2) How long is one regular term for a U.S. Representative?", 
      // a: "3 years", 
      // b: "2 years", 
      // c: "4 years", 
      // d: "5 years", 
      // }, 
      // { 
      // question: "3) Which of the following states is not on the Gulf of Mexico?", 
      // a: "Georgia", 
      // b: "Alabama", 
      // c: "Texas", 
      // d: "Mississippi", 
      // }, 
      // { 
      // question: "4) What white, puffy clouds are known as 'fair weather' clouds?", 
      // a: "Cumulus", 
      // b: "Cumulonimbus", 
      // c: "Stratus", 
      // d: "Cirrus", 
      // }, 
      // { 
      // question: "5) Between 1455 and 1485, the War of the Roses took place in what country?", 
      // a: "France", 
      // b: "England", 
      // c: "Germany", 
      // d: "Spain", 
      // }, 
      // { 
      // question: "6) It's three fifteen PM. What is the degree difference between the hour hand and minute hand?", 
      // a: "0 degrees", 
      // b: "6 degrees", 
      // c: "7.5 degrees", 
      // d: "90 degrees", 
      }] 
     }; 

     function run() { 
      intervalId = setInterval(decrement, 1000); 
      function decrement() { 
       number--; 
       $("#timer").html("<div>Time Left on the Clock: " + number + "</div>"); 
       if (number === 0) { 
        stop(); 
        alert("Time Up!"); 
       } 
      } 
      function stop() { 
       clearInterval(intervalId); 
      } 
     } 

     for(var i = 0; i < questions.questionsArray.length; i++){ 
      $("#questionQ").append("<div>" + questions.questionsArray[i].question + "</div><br>" 
      + "<div><input type = 'radio' name = " + i + " value = " + questions.questionsArray[i].a + " id = 'disable1' " + i + ">" + questions.questionsArray[i].a + "</div>" 
      + "<div><input type = 'radio' name = " + i + " value = " + questions.questionsArray[i].b + " id = 'disable2' " + i + ">" + questions.questionsArray[i].b + "</div>" 
      + "<div><input type = 'radio' name = " + i + " value = " + questions.questionsArray[i].c + " id = 'disable3' " + i + ">" + questions.questionsArray[i].c + "</div>" 
      + "<div><input type = 'radio' name = " + i + " value = " + questions.questionsArray[i].d + " id = 'disable4' " + i + ">" + questions.questionsArray[i].d + "</div><br>"); 
     } 

     $("#submit-button").click(function(){ 
      function answerKey(){ 
       var answers = { 
        answersArray: 
        [{answer0: "Ostrich"}, 
        {answer1: "2 years"}, 
        {answer2: "Georgia"}, 
        {answer3: "Cumulus"}, 
        {answer4: "England"}, 
        {answer5: "7.5 degrees"}] 
       }; 
       var clickA = $("#disable1").click(function(){console.log($(this).attr("checked", true).val());}); 
       var clickB = $("#disable2").click(function(){console.log($(this).attr("checked", true).val());}); 
       var clickC = $("#disable3").click(function(){console.log($(this).attr("checked", true).val());}); 
       var clickD = $("#disable4").click(function(){console.log($(this).attr("checked", true).val());}); 
       if(clickA === answers.answersArray.answer0){ 
        console.log("correct"); 
       } 
       else if (clickA != answers.answersArray.answer0){ 
        console.log("incorrect"); 
       } 
      } 
      answerKey(); 
     }); 

     // Run the functions after start button click 
     run(); 
    }) 


})

來源

2017-05-27 Tim Decilveo

你answersArray是一個數組，所以訪問answer0你應該這麼如下：

answers.anwsersArray[0].answer0

這樣你就可以訪問陣列的第一個元素，您將得到值

來源

2017-05-27 20:21:15 Avinash

仍在控制檯中將其註冊爲「不正確」。 –

你能爲此快速創建一個jsfiddle嗎？ – Avinash

https://jsfiddle.net/timdecilveo/dg7cLdks/#&togetherjs=cbmv276sIw –

單選按鈕單擊事件

回答

相關問題