javascript - 坚持得到每个问题的答案，测验

Question

请帮我做这个练习！我有一个 API 链接https://opentdb.com/api.php?amount=10 我必须从该 API 获取数据才能使用 javascript 进行简单的测验（是的，很简单，但我不知道该怎么做它，对我来说很难）。问题是我确实得到了问题出现在页面上，但 10 个问题的答案相同。我的意思是应该是 10 个问题，里面有 10 个不同的数组，里面有不同的答案。我被困在这里，不知道该怎么做。:(

$.getJSON(url, function (data) { var myQuestions = data.results;

for (question of myQuestions) {
    var correctAnswer = question.correct_answer;
    var totAnswers = question.incorrect_answers;
    totAnswers.push(correctAnswer);
    // console.log(totAnswers);
}

function buildQuiz() {
    const output = [];

    myQuestions.forEach((currentQuestion, questionNumber) => {
        const answers = [];
        for (value of totAnswers) {
            console.log(value);
            answers.push(
              `<label>
                <input type="radio" name="question${questionNumber}" value="${value}">
                ${value} 
              </label>`
            );
          }
        output.push(
            `<div class="slide">
                   <div class="question"> ${currentQuestion.question} </div>
                   <div class="answers"> ${answers.join("")} </div>
                 </div>`
        );
    });
    quizContainer.innerHTML = output.join('');
}

这是它现在的样子：

我认为问题在于我将循环用于 totAnswers 变量。但我不明白为什么。任何人都可以给我一些提示吗？

标签： javascriptarraysweb-applications

Answer 1

我不明白你为什么要形成totAnswers 你想要实现的目标可以这样完成：

function buildQuiz() {
    const output = myQuestions.map((currentQuestion, questionNumber) => (
    `<div class="slide">
        <div class="question">
             ${currentQuestion.question} 
        </div>
        <div class="answers">
${currentQuestion.incorrect_answers.concat(currentQuestion.correct_answer).join('')} 
        </div>
    </div>`))
    quizContainer.innerHTML = output.join('');
};