多项选择测验-单选按钮和功能问题



我正试图使用HTML表单标记中的简单函数和单选按钮创建一个多选测验,但它只允许我在整个测验中选中一个单选按钮,而不是每个问题选中一个。

此外,提交按钮没有激活功能checkAll,我不知道这是因为我试图做一些不可能的事情,还是因为我错过了一些简单的事情。任何帮助都将不胜感激!

代码如下。我只是JavasScript和html以及StackOverflow的新手,所以如果我在这个问题上做错了什么,我很抱歉。

<head>
<script language="javascript">
var score=0;
function checkAll() {
function questioncheckOne(){
    var correctAnswer = document.getElementById("a3")
    if (correctAnswer.checked == true) {
        score++;
        alert("Correct, your score is now " +score)
    }
    else {
            alert("Wrong, your score is now " +score)
    }
};

function questioncheckTwo(){
    var correctAnswer = document.getElementById("b2")
    if (correctAnswer.checked == true) {
        score++;
        alert("Correct, your score is now " +score)
    }
    else {
            alert("Wrong, your score is now " +score)
    }
};

function questioncheckThree(){
    var correctAnswer = document.getElementById("c4")
    if (correctAnswer.checked == true) {
        score++;
        alert("Correct, your score is now " +score)
    }
    else {
            alert("Wrong, your score is now " +score)
    }
};

function questioncheckFour(){
    var correctAnswer = document.getElementById("d3")
    if (correctAnswer.checked == true) {
        score++;
        alert("Correct, your score is now " +score)
    }
    else {
            alert("Wrong, your score is now " +score)
    }
};

function questioncheckFive(){
    var correctAnswer = document.getElementById("e3")
    if (correctAnswer.checked == true) {
        score++;
        alert("Correct, your score is now " +score)
    }
    else {
            alert("Wrong, your score is now " +score)
    }
};
};
</script>
</head>
<body>
<form name ="Where in the world is...?">
<p>
    Question1: Where in the world would you find the Spire? 
</p> 
<input type="radio" name="radio" id="a1" value="a1"  /> Kerry. </input>
<input type="radio" name="radio" id="a2" value="a1"  /> Galway. </input>
<input type="radio" name="radio" id="a3" value="a1"  /> Dublin. </input>
<input type="radio" name="radio" id="a4" value="a1"  /> Donegal. </input>

<p> 

    Question2: Where in the world would you find the Colosseum? 
</p> 

<input type="radio" name="radio" id="b1" value="a2"  /> Taipei. </input>
<input type="radio" name="radio" id="b2" value="a2"  /> Rome. </input>
<input type="radio" name="radio" id="b3" value="a2"  /> Reykjavic. </input>
<input type="radio" name="radio" id="b4" value="a2"  /> Brussels. </input>

<p> 
    Question3: Where in the world would you find the Taj Mahal? 
</p> 

<input type="radio" name="radio" id="c1" value="a3"  /> London. </input>
<input type="radio" name="radio" id="c2" value="a3"  /> Brisbane. </input>
<input type="radio" name="radio" id="c3" value="a3"  /> Paris. </input>
<input type="radio" name="radio" id="c4" value="a3"  /> Agra. </input>

<p> 
    Question4: Where in the world would you find the Parthenon? 
</p> 

<input type="radio" name="radio" id="d1" value="a4"  /> Edinburgh. </input>
<input type="radio" name="radio" id="d2" value="a4"  /> Oslo. </input>
<input type="radio" name="radio" id="d3" value="a4"  /> Athens. </input>
<input type="radio" name="radio" id="d4" value="a4"  /> Pyongyang. </input>

<p> 

    Question5: Where in the world would you find the Niagara Falls? 
</p>

<input type="radio" name="radio" id="e1" value="a5"  /> Hong Kong. </input>
<input type="radio" name="radio" id="e2" value="a5"  /> Moscow. </input>
<input type="radio" name="radio" id="e3" value="a5"  /> New York. </input>
<input type="radio" name="radio" id="e4" value="a5"  /> Ottawa. </input>

<p>
<input type="button" name="submit" id="submit" value="submit" onclick="checkAll()"  /> </input>
</p>

</form>
</body>
</html>

您需要使name属性对于每组单选按钮都是唯一的。目前,它们都被命名为radio

至于checkAll函数,问题是您只是在定义函数,而不是调用它们。在checkAll函数中,实际调用您定义的其他函数:

function checkAll() {
    // existing function definitions here
    questioncheckOne();
    questioncheckTwo();
    // etc
}

选中单选按钮时,将取消选中所有其他同名按钮。在您的情况下,您希望每个问题的收音机都有一个单独的名称(现在,它们都是"收音机")

最新更新