Я разрабатываю викторину 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);
}
Там ответ из двух частей на то, что вы видите:
Во-первых, каждый раз, когда вы запускаете функцию increment
, вы связываете новое событие click с div
с id
q1a
, q2a
, q3a
и q4a
. Это означает, что если у вас есть несколько событий click
привязанных к одному div, один клик будет запускать событие несколько раз.
Затем эти события click на q1a
, q2a
и т. q1a
q2a
ПОСЛЕ события q1a
$('.option')
. Поэтому, когда вы видите второе предупреждение в 0 точках, переменное creative
добавляется к ПОСЛЕ того, как это предупреждение запускается. Вы можете увидеть это, добавив инструкцию console.log()
внутри вашего q2a
click q2a
следующим образом:
$('#q2a').click(function(){
creative +=5;
online ++;
managerial ++;
console.log("q2a",creative);
});
В целом, вы должны либо настроить события щелчка внутри вашей функции increment
в начале сценария, либо определить, какой div был нажат, и добавить значения в соответствии с этим - НЕ добавляйте столько событий кликов.
Надеюсь, это полезно - я могу ответить на другие вопросы, если у вас есть!