增量分数,jQuery测验

时间:2014-02-19 19:41:09

标签: javascript jquery operators increment slickquiz

我一直在开发一个jQuery测验,我已经能够将每个答案的值加在一起,我想在测验中添加一个函数,允许在每个问题之后将特定值添加到一组变量中已经回答了。

我已经包含了一个jsFiddle,你可以在任何值被注册之前看到每个问题被点击它的第三个问题,并且如果添加了第四个问题,则增加的值被添加三次。

JSFiddle:http://jsfiddle.net/jamcrowe/ta7LZ/1/

            // Answers to each question add these values to finalResult
     var value = {
     'question0'   : { one: 1, two: 2, three: 3, four: 4 },
     'question1'   : { one: 1, two: 2, three: 3, four: 4 },
     'question2'   : { one: 1, two: 2, three: 3, four: 4 }
     };

          // The next question to present after each response
     var END = null;
     var nextQuestion = {
        'question0'   : { one: 'question1',   two: 'question1',  three: 'question1', four: 'question1',  },
       'question1'   : { one: 'question2',   two: 'question2',  three: 'question2', four: 'question2',  },
       'question2'  : { one: END,   two: END,  three: END, four: END,  },
   }; 

     // Show just the first question
     $('.ques').hide();
     $('#question0').fadeIn();

     var outcome = 0;

    $('.option').click(function(){

       increment();

       var answer = $(this).attr('value');
       var question = $(this).attr('name');

      outcome += value[question][answer];

      $('#' + question).delay(500).fadeOut(function(){
        var questionNext = nextQuestion[question][answer];
        if (questionNext == END){
            var finalResult = 'result ' + outcome;
            alert("Values added together : " + finalResult);
        }
        else {
            $('#' + questionNext).delay(2000).fadeIn(1000);
        }
    });

   });

    var online = 0;
    var creative = 0;
    var technical = 0;
    var analyst = 0;
   var managerial = 0;

    function  increment() {
    $('#q1a').click(function(){
        creative +=5;
        online ++;
        managerial ++;

    });
    $('#q2a').click(function(){
        creative +=5;
        online ++;
        managerial ++;

    });
    $('#q3a').click(function(){
        creative +=5;
        online ++;
        managerial ++;

    });
    $('#q4a').click(function(){
        creative +=5;
        online ++;
        managerial ++;

    });
    alert(creative);
    }

1 个答案:

答案 0 :(得分:1)

对您所看到的内容有两个部分的答案:

首先,每次运行increment函数时,都会将新的点击事件与div idq1a,{q2a绑定到q3a。 {1}}和q4a。这意味着,如果您有多个click事件绑定到一个div,则单击一次将多次运行该事件。

接下来,q1aq2a等上的这些点击事件会在$('.option')点击事件之后运行。因此,当您在0点看到第二个警报时,变量creative将添加到此警报触发后。您可以在console.log()点击事件中添加q2a语句,如下所示:

$('#q2a').click(function(){
    creative +=5;
    online ++;
    managerial ++;
    console.log("q2a",creative);
});

总的来说,您应该在脚本开头的increment函数内部设置点击事件,或者确定点击了哪个div并根据此添加值 - 不要添加这么多点击事件

希望这有用 - 如果你有任何问题,我可以回答更多问题!