测验显示错误的分数

时间:2017-03-29 17:53:25

标签: javascript html

我正在尝试使用javascipt构建测验应用程序,但它给了我错误的分数。我首先使用0初始化正确的变量,然后每当选择了正确的答案但是显示错误的分数时,希望将正确的变量增加1。我很难找到任何错误但无法找到错误。请有人帮我修复此代码,如果有人能说出显示错误分数的原因,我也会感激不尽。



var questions, question, pos = 0,
  ch1, ch2, ch3, cho, storeval, correct = 0;

questions = [
  ["What is 10 + 4", "12", "14", "16", "B"],
  ["What is 7 x 3", "21", "22", "23", "A"],
  ["What is 20 - 9", "15", "13", "11", "C"],
  ["What is 8/2", "5", "4", "2", "B"]
];

question = document.getElementById('question');


function loadQ() {

  ch1 = questions[pos][1];
  ch2 = questions[pos][2];
  ch3 = questions[pos][3];

  question.innerHTML = questions[pos][0] + "<br>";
  question.innerHTML += "<input type='radio' name='choices' value='A'>" + ch1 + "<br>";
  question.innerHTML += "<input type='radio' name='choices' value='B'>" + ch2 + "<br>";
  question.innerHTML += "<input type='radio' name='choices' value='C'>" + ch3 + "<br>";
}

function submitAnswer() {
  cho = document.getElementsByName('choices');

  for (var i = 0; i < cho.length; i++) {
    if (cho[i].checked) {
      storeval = cho[i].value;
    }
    if (storeval == questions[pos][4]) {
      correct++;
    }
  }
  pos++;

  if (pos < questions.length) {
    loadQ();
  } else {
    question.innerHTML = "Your Score is " + correct;
  }
}
&#13;
<!DOCTYPE html>
<html>

<head>
  <title>Quiz</title>
</head>

<body onload="loadQ()">
  <div id="customize">
    <div id="question"></div>
    <input type="button" onclick="submitAnswer()" value="Submit">
  </div>
</body>

</html>
&#13;
&#13;
&#13;

2 个答案:

答案 0 :(得分:0)

if中有两个独立的submitAnswer语句。第二个检查是storeval == questions[pos][4],但这可能是storeval的旧值,因为它不依赖于第一个if语句来更改当前问题的值。此外,它运行的每个输入都有可能错误的值。它们应该像这样嵌套:

if (cho[i].checked) {
  storeval = cho[i].value;
  if (storeval == questions[pos][4]) {
    correct++;
  }
}

实施例

您可以通过修改循环代码来实际创建实例:

console.log("The loop is about to be entered. storeval is " + storeval + ".");
for (var i = 0; i < cho.length; i++) {
  console.log("The loop is running for answer " + cho[i].value + ". i is " + i + ".");
  if (cho[i].checked) {
    storeval = cho[i].value;
    console.log(cho[i].value + " is checked! Set storeval to " + storeval + ".");
  }
  if (storeval == questions[pos][4]) {
    correct++;
    console.log("storeval matches the expected question " + storeval + "! Update correct to " + correct + ".");
  }
}

以“ X ”开头的消息被检查!“表示输入了第一个if语句。以“storeval开头的消息与预期的问题 X !”匹配,表示已输入第二个if语句。

如果您在第一个问题上选择了正确的答案,您将获得:

  

即将进入循环。 storeval未定义。
  循环正在运行以回答答案A. i是0   循环正在运行以回答答案B. i是1.
  B被检查!将storeval设为B.
  storeval符合预期的问题B!将correct更新为1   循环正在运行以回答C. i是2.
  storeval符合预期的问题B!将correct更新为2。

如果您在第二个问题上选择了正确的答案,您将获得:

  

即将进入循环。 storeval是B.
  循环正在运行以回答答案A. i是0   A被检查!将storeval设为A.
  storeval符合预期的问题A!将correct更新为3.
  循环正在运行以回答答案B. i是1.
  storeval符合预期的问题A!将correct更新为4.
  循环正在运行以回答C. i是2.
  storeval符合预期的问题A!将correct更新为5。

答案 1 :(得分:-1)

而不是for循环来抓取已检查的无线电替换它。将JQuery添加到您的项目中更容易。

function submitAnswer(){

        storeval = $('input[name=choices]:checked').val();

            if(storeval==questions[pos][4]) {
                correct++;
            }

            pos++;

            if (pos < questions.length){
            loadQ();
            } else  {
                question.innerHTML = "Your Score is " + correct ;
            }
    }