Question

我有一个基于网络的测验，可以加载一个新问题，旁边有4个选项和各自的单选按钮。问题是我在＆＃34; next＆＃34;上有一个事件监听器。按钮会触发新问题并加载选项，但不会加载问题。我相信这是因为我每次都会重置步数计数器。还有一点奇怪的是，当事件监听器触发时，我将它输出到控制台，有时当我按下它时它不会触发，有时它会触发。我无法找到一种模式。

如果您想查看所有内容，我已将相关代码包含在JSFiddle的链接中。先感谢您。 http://jsfiddle.net/d0u6cz7o/

function Quiz() {
    this.step = 0;

     this.questionSwap = function () {
         document.getElementById('question').innerHTML = allQuestions[this.step].question;
         document.getElementById('answer0').innerHTML = allQuestions[this.step].choices[0];
         document.getElementById('answer1').innerHTML = allQuestions[this.step].choices[1];
         document.getElementById('answer2').innerHTML = allQuestions[this.step].choices[2];
         document.getElementById('answer3').innerHTML = allQuestions[this.step].choices[3];
};


var quiz = new Quiz();
quiz.questionSwap();

window.addEventListener('load', function() {
    document.getElementById("next").addEventListener("click", function () {
    console.log("Here");
    quiz.questionSwap();
    quiz.step++;
    console.log("current question is " + quiz.step);

    })
});

Answer 1

将提交更改为按钮，删除听众和＆amp;改变轮换的顺序：

<input id="next" type="button" value="Next!">


document.getElementById("next").addEventListener("click", function () 
{
    quiz.step++;
    quiz.questionSwap();
    console.log("current question is " + quiz.step);

})

http://jsfiddle.net/d0u6cz7o/4/

事件监听器不能始终如一地使用Javascript

1 个答案: