JavaScript 测验类型错误：无法读取未定义的属性“0”

Question

这是我的第一个大型 JavaScript 项目，所以请原谅我的无知错误。

我在上面遇到了这个奇怪的错误。

我正在尝试创建一个测验，该测验在存储在数组中的问题中循环。 当用户单击按钮时，问题应该更新。 另外，是的，这是“办公室”主题测验。

这是我的JS：

let q = 0;
let rb1 = 0;
let rb2 = 1;
let rb3 = 2;
let rb4 = 3;

const cycle_questions = function() {
const newQuestion = document.getElementById('nextQuestion');

newQuestion.onclick = function() {
    let currentQuestion = (quizQuestions.question[q]);
    let currentRadio1 = (quizQuestions.choices[rb1]);
    let currentRadio2 = (quizQuestions.choices[rb2]);
    let currentRadio3 = (quizQuestions.choices[rb3]);
    let currentRadio4 = (quizQuestions.choices[rb4])
    $('.question').innerHTML(currentQuestion);
    $('#r1').innerHTML(currentRadio1);
    $('#r2').innerHTML(currentRadio2);
    $('#r3').innerHTML(currentRadio3);
    $('#r3').innerHTML(currentRadio4);
    q++;
    rb1 = rb1 + 3;
    rb2 = rb2 + 3;
    rb3 = rb3 + 3;
    rb4 = rb4 + 3;
};
};

这是我的数组：

const quizQuestions = [{
      "question": "What office employee did Michael hit with his car?",
      "choices": ["Stanley", "Angela", "Kevin" , "Meredith"],
      "correct": "Meredith"
    }, {
      "question": "During the Fire Drill episode, what DID NOT happen?",
      "choices": ["Someone breaks into the vending machine", "Someone throwing a cat into the ceiling", "Someone hides in the utility closet" , "Someone lights firecrackers"],
      "correct": "Someone hides in the utility closet"
    }];

这是我的 HTML：

<form id="game">
            <div class="formContainer">
                <div class="question">Question Goes Here</div>
                <div class="choices">
                    <label id="r1">
                        <input onclick="check()" id="wrong" type="radio" name="answer"/>Answer 1
                    </label>

                    <label class="rightAnswer" id="r2">
                        <input onclick="check()" id="correct" class="correct" type="radio" name="answer"/>Answer 2
                    </label>

                    <label id="r3">
                        <input onclick="check()" id="wrong" type="radio" name="answer"/>Answer 3
                    </label>

                    <label id="r4">
                        <input onclick="check()" id="wrong" type="radio" name="answer"/>Answer 4
                    </label>
                </div>

                <input id="submitButton" class="submitButton" type="submit" value="Submit Answer">
                <button onclick="cycle_questions()" id="nextQuestion" class="nextQuestion">Next Question</button>
            </div>
        </form>

任何帮助表示赞赏！ 谢谢！

Answer 1

你的问题在这一行：

let currentQuestion = (quizQuestions.question[q]);

因为您的 quizQuestions Array 没有属性问题。 相反，数组中的对象具有此属性。

因此抛出错误是因为 quizquestion.question 是“未定义的”并且它没有属性 0 ([q])

你可能想要做的是：

let currentQuestion = (quizQuestions[q].question);

在以下几行中，您也会遇到同样的情况：

quizQuestions.choices[rb1]...