jquery - Quiz App: Buttons in javascript are not functioning -
currently i'm working on quiz in multiple choice format. however, when click on button, doesn't work!
here's full code of mini quiz https://github.com/selvabalasingam/typequiz/blob/master/js/app.js
but i'm sure problem lies between lines 89-103 (i've pasted portion of code below)
$('button.choice').click(function(e) { var choice = $(e.target).text(); var question = quiz.getcurrentquestion(); // check if answer right , update question number , score if (question.answer == choice) { gettotalcorrect = $('.questioncount').text(gettotalcorrect+1); getscore = $('.scorepercentage').text(getscore); } else { gettotalcorrect = $('.questioncount').text(gettotalcorrect+0); getscore = $('.scorepercentage').text(getscore); } // go next question getnextquestion(); });
can tell problem is? there way fix this?
if take @ console, you'll see gettotalcorrect
undefined
. because gettotalcorrect
method attached scope of quiz
object, you're trying access globally.
you can change this:
if (question.answer == choice) { gettotalcorrect = $('.questioncount').text(gettotalcorrect+1); getscore = $('.scorepercentage').text(getscore); } else { gettotalcorrect = $('.questioncount').text(gettotalcorrect+0); getscore = $('.scorepercentage').text(getscore); } getnextquestion();
to:
question.answer = choice; // pass user's choice question object $('.questioncount').text(quiz.gettotalcorrect()); $('.scorepercentage').text(quiz.getscore()); quiz.getnextquestion(); // load next question rendertext(quiz.getcurrentquestion()); // render new font
it looks rendertext
indefinitely call itself:
var rendertext = function(question) { $('.text').css('font-family', question.correctchoice); rendertext(quiz.getcurrentquestion()); // infinite recursion call };
instead, call rendertext when page loads, so:
var rendertext = function(question) { $('.text').css('font-family', question.correctchoice); }; rendertext(quiz.getcurrentquestion());
Comments
Post a Comment