我创建了一个测试，修改了我在网上找到的代码，但我有一个小问题

I have created a quiz, ammending code I have found on the web, but I am having a slight issue

本文关键字：问题 有一个 代码 修改 创建 测试 一个      更新时间：2023-09-26

我修改了这段代码，创建了一个测试，用户可以通过检查单选按钮来回答问题。

var totalScore = 0;
var numAnswer = 0;

//an array with objects that hold the questions
var allQuestions = [{question: ["Q1: Who was the Top Goalscorer in the 1998 World Cup?"],
                    choices: ["Ronaldo", "Davor Sukor", "Zinedine Zindane", "Thierry Henry"],
                    correctAnswer:1},
    {question: ["Q2: Where was the 1998 World Cup Final Held?"],
     choices: ["Parc des Princes", "Stade Velodrome", "Stade de France", "Stade de Gerland"],
    correctAnswer:2},
    {question: ["Q3: What was the score in the 1998 World Cup Final?"],
    choices: ["2-0", "2-1", "3-0", "3-1"],
    correctAnswer:2},
    {question: ["Q4: Who won the 2002 World cup?"],
    choices: ["France", "Holland", "Brazil", "Germany"],
    correctAnswer:2},
    {question: ["Q5: Who was the Top Goalscorer in the 2002 World Cup?"],
    choices: ["Vieri", "Ronaldo", "Klose", "Ballack"],
    correctAnswer:1}];
//create the questions created by the array, first unselecting all radiobuttons
function createQuestions() {
    for (var i = 0; i < 4; i++) {
        document.getElementById("answerswer" + i).checked = false;
    }
    var quizQuestion = document.getElementById("questions");
    quizQuestion.innerHTML = allQuestions[this.numAnswer].question[0];
    createOptions();
}
//change the innerHTML of the label by calling it's ID
function createOptions() {
    for (var o = 0; o <= allQuestions[0].choices[o].length; o++) {
        document.getElementById("a" + o).innerHTML = allQuestions[this.numAnswer].choices[o];
    }
}
//create an HTMLcollection using document.forms and check selected radiobutton and
//corresponding value.
function checkAnswers() {
    var methods = document.forms.radioAnswers.elements.choice;

    if (this.numAnswer < 4) {
        for (var i = 0; i < methods.length; i++) {
            if (methods[i].checked) {
                answer = methods[i].value;
            }
        }
        //check if answer is correct answer.
        if (parseInt(answer) === allQuestions[this.numAnswer].correctAnswer) {
            this.totalScore += 1;
        }
        this.numAnswer += 1;
        createQuestions();
    } else {
        showScore();
    }
}
function showScore() {
    var printTotalscore = document.getElementById("questions");
    printTotalscore.innerHTML = "Your total score is: " + this.totalScore;
    var removeRadio = document.getElementById("questions_form").style.display="none";
    var removeButton = document.getElementById("next").style.display="none";
}


window.onload = createQuestions();

我已经阅读了代码，我知道它使用了一系列for循环来创建问题，为问题答案创建HTML，并最终跟踪问题的数量。

关于最后一个问题，分数没有像其他问题一样正确更新，我认为这与循环的期末考试有关，但我已经尽可能多地调试了它，但我仍然不知道如何修复它。

这一行if (this.numAnswer < 4)是我认为问题所在的地方，因为在最后一个循环之后，它将直接进入函数showScore()，我可能错了，但如果我将循环更改为(this.numAnswer <= 4)，则需要再次选择最后一个问题，然后分数是正确的。

有人能帮我解决这个问题吗？

下面是代码笔，也许可以让它变得更容易：http://codepen.io/Addiosamigo/pen/fFHly

感谢

问题似乎是您正确识别的if语句。代码的行为是这样的，因为在最后一个答案上，你没有检查它的漏洞/更新分数。

您需要更改代码，以确保即使在最后一个问题上也能进行分数检查。由于需要始终进行分数检查，最简单的解决方案可能是将if语句移动到只包含显示结果的下一个问题的逻辑。

for (var i = 0; i < methods.length; i++) {
    if (methods[i].checked) {
        answer = methods[i].value;
    }
}
//check if answer is correct answer.
if (parseInt(answer) === allQuestions[this.numAnswer].correctAnswer) {
    this.totalScore += 1;
}
// Move the if statement to here
if (this.numAnswer < 4) {
    this.numAnswer += 1;
    createQuestions();
} else {
    showScore();
}

这一点可以在-http://codepen.io/anon/pen/ezgtD.该代码还删除了一些幻数。

相关文章：