2016-11-16 27 views
0

我正在写一个测验应用程序,引用一个对象的值,一切都很好,即使这是初学者的代码。具体而言,当用户点击“下一个问题”按钮时,我希望将第一个问题替换为第二个问题。但是,当我的nextQuestion()增加对象中的变量时,它在代码的其余部分没有改变。使用一个函数来更新使用jQuery的另一个函数使用的对象值?

var quiz = { //the questions, you get the idea// 
 
    correctCount: 0, 
 
    currentQuestion: 0, //THIS IS WHAT I WANT TO UPDATE IN EACH ITERATION 
 
    questions: [{ 
 
    question: "Question 1?", 
 
    answers: ["A", "B", "C", "D"], 
 
    correct: "A" 
 
    }, { 
 
    question: "Question 2?", 
 
    answers: ["A", "B", "C", "D"], 
 
    correct: "C" 
 
    }] 
 
}; 
 

 
$(document).ready(function() { 
 
    $(".question").hide(); 
 

 
    //jquery event delegation 
 
    function generateQuestion() { 
 
    $("div.question").prepend(quiz.questions[quiz.currentQuestion].question); 
 
    var answerList = quiz.questions[quiz.currentQuestion].answers; 
 
    console.log(answerList); 
 
    for (var i = 0; i < answerList.length; i++) { 
 
     $("ul").append("<li>" + answerList[i] + "</li>"); 
 
    } 
 
    console.log(quiz.currentQuestion); 
 
    } 
 

 
    function questionCheck() { 
 
    $(".question-space").on('click', 'li', function(e) { // 
 
     e.preventDefault(); 
 
     console.log($(this).val()); 
 
     if ($(this).text() === quiz.questions[quiz.currentQuestion].correct) { 
 
     alert("Yes! The correct answer was " + quiz.questions[quiz.currentQuestion].correct + "!"); 
 
     quiz.correctCount += 1; 
 
     $(".numCorrect").text(quiz.correctCount); 
 
     } else { 
 
     alert("Sorry! The correct answer was " + quiz.questions[quiz.currentQuestion].correct + "!"); 
 
     } 
 
    }); 
 
    } 
 

 
    function nextQuestion() { 
 
    $(".next-question").on('click', function(e) { 
 
     e.preventDefault(); 
 
     quiz.currentQuestion += 1; 
 
     console.log(quiz.currentQuestion); 
 
    }); 
 
    } 
 

 

 
    //Event listeners 
 
    $(".start-quiz").click((function() { 
 
    $(".box").hide(); 
 
    $("div.question").show(); 
 
    generateQuestion(); 
 
    questionCheck(); 
 
    nextQuestion(); 
 
    })); 
 

 
});

+0

您在'question:'数组末尾丢失了']',''quiz'对象末尾的'}'。 – Barmar

+0

什么是'quiz.questions [* * quiz.currentQuestion * *]'应该是什么意思?你不能像那样使用'*'。 – Barmar

+0

如果这应该是代码突出显示,那么您不能在SO上的代码块中进行标记。 – Barmar

回答

0

确定。我能意识到我并没有在功能渲染后的任何解决它:

function nextQuestion() { 
    $(".next-question").on('click', function(e) { 
    e.preventDefault(); 
    quiz.currentQuestion += 1; 
    console.log(quiz.currentQuestion); 
    $("div.question").empty(); 
    generateQuestion(); 
    questionCheck(); 
    }); 
} 

我需要改变我的一些的jQuery中产生问题的功能,因为empty()方法取出所有子代的,但是这至少让功能起作用。

相关问题