我正在尝试使用javascript构建一个多项选择测试,它一次显示一个问题(淡入下一个问题).在所有问题都得到解答后,根据您的答案,它会为您提供结果.实际问题的结果不需要仅显示该分数的分数和解释,因为结果将是一堆文本.
例如：
>得分0-20 =结果1
> 21-50 =结果2
> 51-60 =结果3
> 61-80 =结果4
> 81 – 100 =结果5
下面是我的代码,如何更改它以便没有答案是“正确的”它只是在测验结束时根据上述分数的范围给出文本结果？
使用Javascript：
@H_404_17@ (function() {
var questions = [{
question: "Question1",choices: ["choice1","choice2","choice3"],correctAnswer:0
},{
question: "Question2",correctAnswer: 4
},{
question: "Question3",correctAnswer: 0
},{
question: "Question4","choice3"]
correctAnswer: 3
},{
question: "Question5",correctAnswer: 4
}];
var questionCounter = 0; //Tracks question number
var selections = []; //Array containing user choices
var quiz = $('#quiz'); //Quiz div object
// Display initial question
displayNext();
// Click handler for the 'next' button
$('#next').on('click',function (e) {
e.preventDefault();
// Suspend click listener during fade animation
if(quiz.is(':animated')) {
return false;
}
choose();
// If no user selection,progress is stopped
if (isNaN(selections[questionCounter])) {
alert('Please make a selection!');
} else {
questionCounter++;
displayNext();
}
});
// Click handler for the 'prev' button
$('#prev').on('click',function (e) {
e.preventDefault();
if(quiz.is(':animated')) {
return false;
}
choose();
questionCounter--;
displayNext();
});
// Click handler for the 'Start Over' button
$('#start').on('click',function (e) {
e.preventDefault();
if(quiz.is(':animated')) {
return false;
}
questionCounter = 0;
selections = [];
displayNext();
$('#start').hide();
});
// Animates buttons on hover
$('.button').on('mouseenter',function () {
$(this).addClass('active');
});
$('.button').on('mouseleave',function () {
$(this).removeClass('active');
});
// Creates and returns the div that contains the questions and
// the answer selections
function createQuestionElement(index) {
var qElement = $('dioButtons = createRadios(index);
qElement.append(radioButtons);
return qElement;
}
// Creates a list of the answer choices as radio inputs
function createRadios(index) {
var radioList = $('dioList.append(item);
}
return radioList;
}
// Reads the user selection and pushes the value to an array
function choose() {
selections[questionCounter] = +$('input[name="answer"]:checked').val();
}
// Displays next requested element
function displayNext() {
quiz.fadeOut(function() {
$('#question').remove();
if(questionCounter < questions.length){
var nextQuestion = createQuestionElement(questionCounter);
quiz.append(nextQuestion).fadeIn();
if (!(isNaN(selections[questionCounter]))) {
$('input[value='+selections[questionCounter]+']').prop('checked',true);
}
// Controls display of 'prev' button
if(questionCounter === 1){
$('#prev').show();
} else if(questionCounter === 0){
$('#prev').hide();
$('#next').show();
}
}else {
var scoreElem = displayscore();
quiz.append(scoreElem).fadeIn();
$('#next').hide();
$('#prev').hide();
$('#start').show();
}
});
}
// Computes score and returns a paragraph element to be displayed
function displayscore() {
var score = $('score.append('You got ' + numCorrect + ' questions out of ' +
questions.length + ' right!!!');
return score;
}
})();
HTML：
@H_404_17@IoUs
最佳答案
以下是您的问题的答案如何在确定0-100范围内的最终结果时具有“权重”以及介于两者之间的内容：
@H_404_17@var questions = [
{
question: "Question1",choices: [
"choice1","choice3"
],weights: [10,7,3]
},{
question: "Question2",weights: [3,10,7]
},{
question: "Question3",choices: [
"choice1":10,"choice2":0,"choice3":10
],10]
},{
question: "Question4",{
question: "Question5",3,7]
}
];
我所做的是取最高分,即100分并除以我给出的问题数,在这种情况下为5,然后在答案之间将每个问题的20分不等(并且这很重要)除以给“最佳”答案提供更多分数,给“最差”答案提供更少或0分.
注意我总是确保任何给定问题中的所有点都等于20,这样每个问题的选择在确定分数时将是“公平的”.我希望能解决你问题的“不正确答案”部分.
更新：我已更新代码,以便更容易处理答案.
在“新”版本中,每个问题都有一个“权重”数组,权重数字应分别对应于每个“选择”.在您的申请中,每个问题都应该按如下方式处理：
获取“问题”值并将其显示在HTML标记中.
从“choices”数组中获取选项并将其显示在HTML select options标记内,如下例所示：
@H_404_17@