使用单选按钮和数组进行 Javascript 测试

Question

我正在学习 Javascript，但我无法弄清楚如何使用纯 Javascript(无 jQuery)创建测试。

理想情况:

1. 系统会向用户提出问题并提供单选按钮选项。
2. 用户根据问题选择单选按钮
3. 提交后，会将选项与包含答案的数组进行比较。
4. 单选按钮不能留空。如果选择与答案不相等，则提醒用户。

到目前为止，我已经尝试过嵌套 for 循环和分隔 if/else 语句，但没有成功。

提前非常感谢!

var answers = [
	0, // Answer for question0
  1, // Answer for question1
  2 // Answer for question2
];

var question = [];

function grade(){
  for(var i = 0; i < 10; i++){
    question[i] = document.querySelector("input[name='question" +  i + "']");
    if(question[i].checked){
      if(question[i].value = answers[i]){
        alert("question " + i + " is correct!");
      }
      else{
        alert("Incorrect! Try again.");
      }
    } 
    else{
      alert("Select a valid choice!");
    }
  }
}

<form>
  <input type="radio" name="question0" value="0">Option A<br>
  <input type="radio" name="question0" value="1">Option B<br>
  <input type="radio" name="question0" value="2">Option C
  
  <hr>
  
  <input type="radio" name="question1" value="0">Option A<br>
  <input type="radio" name="question1" value="0">Option B<br>
  <input type="radio" name="question1" value="0">Option C
  
  <hr>
  
  <input type="radio" name="question2" value="0">Option A<br>
  <input type="radio" name="question2" value="1">Option B<br>
  <input type="radio" name="question2" value="2">Option C<br>
  <input type="radio" name="question2" value="3">Option D
  
  <hr>
  
  <input type="submit" onClick="grade();" value="Grade">
</form>

Answer 1

请找到编辑后的工作代码。它可能对你有帮助。

var answers = [
    0, // Answer for question0
  1, // Answer for question1
  2 // Answer for question2
];

var question = [];

function grade(){

  for (var i = 0, ques = 3; i < ques; i++) {
    var radios = document.getElementsByName('question'+ i +'[]');

    for (var j = 0, length = radios.length; j < length; j++) {
        if (radios[j].checked) {

            if(radios[j].value == answers[i]){
              alert("question " + i + " is correct!");
            }
            else{
              alert("Incorrect! Try again.");
            }

            break;
        }
    }
  }

}

<form>
  <input type="radio" name="question0[]" value="0">Option A<br>
  <input type="radio" name="question0[]" value="1">Option B<br>
  <input type="radio" name="question0[]" value="2">Option C

  <hr>

  <input type="radio" name="question1[]" value="0">Option A<br>
  <input type="radio" name="question1[]" value="1">Option B<br>
  <input type="radio" name="question1[]" value="2">Option C

  <hr>

  <input type="radio" name="question2[]" value="0">Option A<br>
  <input type="radio" name="question2[]" value="1">Option B<br>
  <input type="radio" name="question2[]" value="2">Option C<br>
  <input type="radio" name="question2[]" value="3">Option D

  <hr>

  <input type="button" onClick="grade();" value="Grade">
</form>