多项选择测验-获得分数？

Question

我试图用HTML创建一个简单的多项选择程序，但是在获取用户输入并在最后显示他们的分数时遇到了麻烦。有人可以帮我吗？

我的多项选择测验有10个问题，每个问题有4个选择。

例如，这是一个问题：

<li>
<h3>How many letters are there in "JS"?</h3>
<input type="radio" name="question9" value="A">2<br>
<input type="radio" name="question9" value="B">1<br>
<input type="radio" name="question9" value="C">3<br>
<input type="radio" name="question9" value="D">4<br>
</li>

这是我用来显示用户结果的按钮：

 <button onclick="returnScore()">View Results</button>

这是我当前的脚本：

var userInput = new Array();
var answers = new Array(10);
answers[0] = "B";
answers[1] = "C";
answers[2] = "A";
answers[3] = "C";
answers[4] = "D";
answers[5] = "D";
answers[6] = "D";
answers[7] = "D";
answers[8] = "C";
answers[9] = "A";

function getScore(){
var score=0;
var numQuestions=10;

for (var i=0;i<numQuestions;i++){
if (userInput[i]==answers[i]){
score += 1;
}
else{
score += 0;
}

}
return score;
}
function returnScore(){
alert("Your score is "+getScore()+"/10");
}

谢谢。

Answer 1

确保您的名称以0（question0）开头，因为ifor循环内已建立0索引。

您忘记循环单选元素（通过当前索引名称）来获取已检查元素的值：

var answers = ["A","C","B"], 
    tot = answers.length;

function getCheckedValue( radioName ){
    var radios = document.getElementsByName( radioName ); // Get radio group by-name
    for(var y=0; y<radios.length; y++)
      if(radios[y].checked) return radios[y].value; // return the checked value
}

function getScore(){
  var score = 0;
  for (var i=0; i<tot; i++)
    if(getCheckedValue("question"+i)===answers[i]) score += 1; // increment only
  return score;
}

function returnScore(){
  alert("Your score is "+ getScore() +"/"+ tot);
}

<ul>
  <li>
    <h3>How many letters are there in "JS"?</h3>
    <input type="radio" name="question0" value="A">2<br>
    <input type="radio" name="question0" value="B">1<br>
    <input type="radio" name="question0" value="C">3<br>
    <input type="radio" name="question0" value="D">4<br>
  </li>
  <li>
    <h3>How many letters are there in "BMX"?</h3>
    <input type="radio" name="question1" value="A">2<br>
    <input type="radio" name="question1" value="B">1<br>
    <input type="radio" name="question1" value="C">3<br>
    <input type="radio" name="question1" value="D">4<br>
  </li>
  <li>
    <h3>How many letters are there in "A"?</h3>
    <input type="radio" name="question2" value="A">2<br>
    <input type="radio" name="question2" value="B">1<br>
    <input type="radio" name="question2" value="C">3<br>
    <input type="radio" name="question2" value="D">4<br>
  </li>
</ul>

<button onclick="returnScore()">View Results</button>

您无需返回+= 0分数即可。如果您有一个正面的匹配，只需增加它。

实例化新数组时，请使用简写[]代替new Array()。