Question

我有以下HTML：

<fieldset id="question1">
<legend>Which are fruit?</legend>
<label><INPUT TYPE="checkbox" NAME="q1" VALUE="wrong">tomatoes<BR></label>
<label><INPUT TYPE="checkbox" NAME="q2" VALUE="wrong">cucumber<BR></label>
<label><INPUT TYPE="checkbox" NAME="q3" VALUE="right">apples<BR></label>
<label><INPUT TYPE="checkbox" NAME="q4" VALUE="wrong">onion<BR></label>
<label><INPUT TYPE="checkbox" NAME="q5" VALUE="right">bananas<BR></label>
</fieldset>
<input type="button" id="answer">

和JavaScript：

   document.getElementById("answer").onclick = validate;
    function validate() {
        var checkbox;
        var i;
        var right;
        checkboxes = document.getElementById("question1").getElementsByTagName("input");

        right = false;
        for(i = 0; i < checkboxes.length; i++) {
            if(checkboxes[i].value == "right" && checkboxes[i].checked == true) {
              right = true;
            }
        }

        if(right) {
            alert("You answered correctly");
        } else {
            alert("Wrong answer");
        }
    }

我的测验几乎正常，但我只想在选中所有正确的选项时才能正确。在选择一个正确的选项时，无论是否还选择了其他不正确的选项，它仍然会重新正确。

以下是实时示例：http://jsfiddle.net/nzLmxfx7/ 谢谢！

Answer 1

试试这个，这在我的电脑上有效。

HTML：

<fieldset id="question1">
    <legend>Which are fruit?</legend>
    <label><INPUT TYPE="checkbox" NAME="input" VALUE="wrong">tomatoes<BR></label>
    <label><INPUT TYPE="checkbox" NAME="input" VALUE="wrong">cucumber<BR></label>
    <label><INPUT TYPE="checkbox" NAME="input" VALUE="right">apples<BR></label>
    <label><INPUT TYPE="checkbox" NAME="input" VALUE="wrong">onion<BR></label>
    <label><INPUT TYPE="checkbox" NAME="input" VALUE="right">bananas<BR></label>
</fieldset>
<input type="button" id="answer" value="Submit">

JavaScript：

document.getElementById("answer").onclick = validate;

function validate() {
    var checkboxes = document.getElementsByName("input");
    var checkboxChecked = []; 

    for(var i = 0; i < checkboxes.length; i++) {
        if(checkboxes[i].checked && (checkboxes[i].value === "right")) {
            checkboxChecked.push(checkboxes[i]);
        }
    }

    if(checkboxChecked.length === 2) {
        alert("You answered correctly");
    } 
    else {
        alert("Wrong answer");
    }
}

Answer 2

以其他方式做。默认情况下将right设置为true，如果未选中正确的复选框或选中了错误的复选框，则将其设置为false。

Answer 3

如果用户选择了一个值为true的复选框，则只将flag（right）的值设置为true。

如果用户选择了一个值为false的复选框，您还需要将flag设置为false。

对于Ex：如果用户检查苹果和洋葱。然后你的代码将检查apples复选框并将标志设置为true。洋葱没有代码执行。

我认为你明白我的观点

添加：

 if(checkboxes[i].value == "wrong" && checkboxes[i].checked == true) {
              right = false;
            }

带复选框的多个测验 - 多个选项

3 个答案: