Question

你好我想尝试进行动态测验以学习javascript / jquery / html和css ...我卡住了因为我刚刚添加了一个后退按钮，用这个后退按钮用户可以回去查看他的最后一个回答也改变了，如果最后一个答案得到了正确回答，那么得分 - ;但如果没有正确回答，它就不会有任何勇气，以避免人们获得无限分数。我真正的问题是我使用lastValue变量来存储las单选按钮，所以当你回去它可以比较，但它只是运行良好我回去一次，然后lastValues不更新所以行为是奇怪的，这是用于比较值的代码的和平：

function backQuestion(){
    if (number == 9){
        $('#myForm').css('display', 'inline-block');
        $('#question').css('display', 'block');
        $('#next').css('display', 'inline-block');
        $('#score').css('display', 'none');
    }

    if(number > 0){
        number --;
        addQuestionAndAnswers();
        if (lastValue == allQuestions[number].answer){
            score --;
            console.log('your score after going back is: ' + score);
            console.log('the last value is: ' + lastValue);
            console.log('this is the value of number: ' + number);
        }else{
            //lastValue = 
            console.log('your score after going back is: ' + score);
            console.log('the last value is: ' + lastValue);
            console.log('this is the value of number: ' + number);
        }
    }


}

我也留下了js小提琴演示，所以你可以检查其余的代码和变量。虽然我写这篇文章只是为了存储响应的值和数组，然后只是每个响应都回答了存储数组中的值，然后当你按下按钮时你可以得到那个英勇的比较，然后你可以如果答案再次得到回答，请删除那个勇气....我不确定这是否是一个复杂的方式...如果有人可以告诉我或建议我一个简单的方法，我会感激不尽：）

js fiddle：http://jsfiddle.net/xtatanx/Wn8Qg/2/

js小提琴结果全屏：http://jsfiddle.net/xtatanx/Wn8Qg/2/embedded/result/

Answer 1

我建议存储所有答案，例如：

http://jsfiddle.net/Wn8Qg/4/

$(ready);

function ready(){
    var allQuestions =
    [
        {
            question: "Whats my real name?",
            choices: ["Jhonnatan", "Alberto", "Tatan","Jaime"],
            answer: 0
        },

        {
            question: "Who is Colombia's president?",
            choices: ["Alvaro Uribe", "Andres Pastrana", "Juan Manuel Santos","Tatan"],
            answer: 2
        },

        {
            question: "My favorite super heroe?",
            choices: ["Batman", "Flash", "Tatan","Javascript"],
            answer: 3
        },

        {
            question: "Wich sports do i practice?",
            choices: ["Climbing", "Swimming", "Programming","Running"],
            answer: 0
        },

        {
            question: "Whats my dad's name?",
            choices: ["Alberto", "Jorge", "Javier","Jose"],
            answer: 1
        },

        {
            question: "Whats my favorite color?",
            choices: ["Red", "Purple", "Blue","All"],
            answer: 2
        },

        {
            question: "My favorite alcoholic drink",
            choices: ["Vodka", "Aguardiente", "Rum","Tekila"],
            answer: 3
        },

        {
            question: "Whats my favorite kind of music?",
            choices: ["Hardcore", "Reggaeton", "Salsa","Programming"],
            answer: 0
        },

        {
            question: "How many qestions has this quiz??",
            choices: ["20", "8", "10","12"],
            answer: 2
        },

        {
            question: "My favorite programming lenguage?",
            choices: ["Ruby", "Arduino", "Python","Javascript"],
            answer: 3
        }
    ];

    var score = 0;
    var number = 0;
    var question = $('#question');
    var choice1 = $('#answer0');
    var choice2 = $('#answer1');
    var choice3 = $('#answer2');
    var choice4 = $('#answer3');
    var next = $('#next');
    var back = $('#back');
    var currentQuestion = $('#current-question');

    var answers = new Array(allQuestions.length);

    next.click(on_click_next);
    back.click(on_click_back);

    populate();

    function populate() {
        currentQuestion.text(number + 1);

        question.text(allQuestions[number].question);

        choice1.text(allQuestions[number].choices[0]);
        choice2.text(allQuestions[number].choices[1]);
        choice3.text(allQuestions[number].choices[2]);
        choice4.text(allQuestions[number].choices[3]);

        $(":radio").prop('checked', false);

        if (answers[number] !== null)
            $(":radio").eq(answers[number]).prop('checked', true);
    }

    function on_click_next(){
        if($(":radio:checked").length == 1)
        {
            answers[number] = $(":radio:checked").val();

            number++;

            if (number < allQuestions.length) {
                populate();
            } else {
                displayResult();
            }
        }else{
            alert('please select an answer before proceed');
        }

        function displayResult(){
            var score = get_score();
            currentQuestion.text(allQuestions.length);

            $('#question, #alternatives').hide();
            $('#next').hide();
            $('#score').show();
            $('#score').text('Your score is: ' + score + 'pts');
        }
    }

    function get_score()
    {
        var result = 0;
        for(var i = 0; i < answers.length; i++)
            if (allQuestions[i].answer == answers[i])
                result++;

        return result;
    }

    function on_click_back()
    {
        if (number == allQuestions.length)
        {
            $('#question, #alternatives').show();
            $('#next').show();
            $('#score').hide();

            number--;

            populate();
        }
        else
        {
          if(number > 0)
          {
              number--;
              populate();
          }
       }
    }
}

使用jquery获取测验中使用的最后一个值

1 个答案: