测试应用程序:javascript中的按钮不起作用

Quiz App: Buttons in javascript are not functioning

本文关键字：按钮 不起作用 javascript 应用程序 测试      更新时间：2023-09-26

目前我正在做一个选择题形式的测验。然而，当我点击一个按钮时，它根本不起作用!

这是我的小测验的完整代码https://github.com/selvabalasingam/TypeQuiz/blob/master/js/app.js

但是我确定问题在第89-103行之间(我已经将这段代码的一部分粘贴在下面)

$('button.choice').click(function(e) {
    var choice = $(e.target).text();
    var question = quiz.getCurrentQuestion(); 
    // check if the answer is right and update question number and score
    if (Question.answer == choice) {
        getTotalCorrect = $('.questionCount').text(getTotalCorrect+1); 
        getScore = $('.scorePercentage').text(getScore);
    }
    else {
        getTotalCorrect = $('.questionCount').text(getTotalCorrect+0); 
        getScore = $('.scorePercentage').text(getScore);
    }
    // then go to the next question
    getNextQuestion();
});

谁能告诉我是什么问题?有什么办法可以弥补吗?

变化

getTotalCorrect = $('.questionCount').text(getTotalCorrect+1);

getTotalCorrect = $('.questionCount').text(quiz.getTotalCorrect+1);

查看控制台，您将看到getTotalCorrect为undefined。这是因为getTotalCorrect是附属于quiz对象范围的方法，但是您试图全局访问它。

你可以修改:

if (Question.answer == choice) {
    getTotalCorrect = $('.questionCount').text(getTotalCorrect+1); 
    getScore = $('.scorePercentage').text(getScore);
}
else {
    getTotalCorrect = $('.questionCount').text(getTotalCorrect+0); 
    getScore = $('.scorePercentage').text(getScore);
}
getNextQuestion();

: 

question.answer = choice;    // pass the user's choice to the question object
$('.questionCount').text(quiz.getTotalCorrect());
$('.scorePercentage').text(quiz.getScore());
quiz.getNextQuestion();    // load the next question
renderText(quiz.getCurrentQuestion());    // render the new font

看起来renderText将无限地调用自己:

var renderText = function(question) {
    $('.text').css('font-family', question.correctChoice);
    renderText(quiz.getCurrentQuestion());   // infinite recursion call
};
相反，在页面加载时调用renderText，如下所示: 
var renderText = function(question) {
    $('.text').css('font-family', question.correctChoice);
};
renderText(quiz.getCurrentQuestion());

您从未设置您的Question.answer值。这个值有时是一个函数，有时是一个对象。您可能应该将Question.answer(作为一个函数)重命名为Question.setAnswer。

from this gist

Question.prototype = {
    setAnswer: function(choice) {
        this.answer = choice;
    },
}

话虽如此，Question.answer/Question.setAnswer永远不会被调用，相反，你想直接查看Question.correctChoice。

   if (Question.correctChoice == choice) {
        getTotalCorrect = $('.questionCount').text(getTotalCorrect+1); 
        getScore = $('.scorePercentage').text(getScore);
    }
    else {
        getTotalCorrect = $('.questionCount').text(getTotalCorrect+0); 
        getScore = $('.scorePercentage').text(getScore);
    }
相关文章：