javascript - 使用 javascript 选择单选按钮。

Question

我目前正在学习 javascript。我想创建一个动态测验，现在我想检查单选按钮的值。这是我的代码:

HTML:

<div class="intro">
<h1>Welcome at my JavaScript Quiz</h1>
<br>

<span id="questions"></span>

<form name="radioAnswers">
    <input type="radio" id="answer0" name="choice" value="a"><label for ="answer0" id="a0">Answer A</label>
    <input type="radio" id="answer1" name="choice" value="b"><label for ="answer1" id="a1">Answer B</label>
    <input type="radio" id="answer2" name="choice" value="c"><label for ="answer2" id="a2">Answer C</label>
    <input type="radio" id="answer3" name="choice" value="c"><label for ="answer3" id="a3">Answer D</label>
</form>

<div class="buttons">
<button onclick="checkAnswers()">Submit answer</button>
</div>

还有 checkAnswers 函数来检查答案。据我了解， document.forms.radioAnswers.elements.choice 将创建一个 HTMLcollection。我想迭代这个类似数组的列表，并想看看检查了哪一个，然后将其放入答案变量中。像这样:

function checkAnswers() {
    var methods = document.forms.radioAnswers.elements.choice;
    var answer;
    for (var i = 0; i<methods.length; i++) {
        if (methods[i].checked) {
            answer = methods[i].value;
        } else {
            answer = "error"
        }
    } alert(answer);
}

当我运行它时，它总是发出“错误”警报。我错过了什么？

Answer 1

找到答案后，您需要打破循环，如下所示:

function checkAnswers() {
   var methods = document.forms.radioAnswers.elements.choice;
    var answer = "error";
    for (var i = 0; i<methods.length; i++) {
        if (methods[i].checked) {
            answer = methods[i].value;
            break;
        }
    }
    alert(answer);
}

DEMO