我无法编写一个循环来计算我为我的 wordpress 网站创建的测验的分数。
测验样式是“将 A 列中的项目与 B 列中的项目进行匹配”。
B 列项目使用选择元素来匹配 A 列中的相应项目。
我能想到的最好办法是像这样手动将每个选定的答案添加在一起..
html
<select id="testValues1">
<option value="right">a</option>
<option value="wrong">b</option>
<option value="wrong">c</option>
</select>
<select id="testValues2">
<option value="wrong">a</option>
<option value="right">b</option>
<option value="wrong">c</option>
</select>
<select id="testValues3">
<option value="wrong">a</option>
<option value="wrong">b</option>
<option value="right">c</option>
</select>
<button type="button" onclick="finalScore()">Submit</button>
<div id="scoreDisplay">score goes here</div>
JavaScript
<script>
function finalScore(){
var i = 0;
var select1 = document.getElementById("testValues1");
var answer1 = select1.options[select1.selectedIndex].value;
if(answer1 == "right"){
i++;
}
var select2 = document.getElementById("testValues2");
var answer2 = select2.options[select2.selectedIndex].value;
if(answer2 == "right"){
i++;
}
var select3 = document.getElementById("testValues3");
var answer3 = select3.options[select3.selectedIndex].value;
if(answer3 == "right"){
i++;
}
document.getElementById("scoreDisplay").innerHTML = i;
}
</script>
上面的效果很好,但我想添加更多这样的测验,有些测验有超过 3 个可能的问题/匹配。
我一直无法编码的想法..
JavaScript
function finalScore() {
var answersCorrect = 0;
var answersCounter = 0;
foreach "select" {
var rightOrWrong = "get value";
if (rightOrWrong = right) {
answersCorrect++
}
answersCounter++;
}
var finalScore = Math.floor((answersCorrect / answersCounter) * 100));
document.getElementById("scoreDisplay").innerHTML = finalScore;
}
解决方案不一定是纯 javascript,如果不可能的话,但我对 jquery 的精通程度更低。
最佳答案
我相信以下功能将使您的测验代码更易于重用。在计算正确答案的百分比时,它会考虑问题的数量。为了添加问题,您只需将类问题添加到将成为问题的每个选择语句中。
现场演示:http://codepen.io/larryjoelane/pen/ZQrKjY
function finalScore(){//begin function
//initialize the correct variable
var correct = 0;
var selectValue;
//store the collection of elements with the class name question
var questions = document.getElementsByClassName("question");
//the number of questions(elements with a class name of question)
var numOfQuestions = questions.length;
//loop through the collection of elements with a question class
for(var i = 0; i < questions.length; i++ ){//begin for loop
//get the value of the select element
selectValue = questions[i].options[questions[i].selectedIndex].value;
//if the value equals right
if(selectValue === "right"){//begin if then
//increment the correct variable
correct++;
}//end if then
}//end for loop
//get the percentage of correct answers
document.getElementById("scoreDisplay").innerHTML = (100/numOfQuestions) * correct;
}//end function
HTML(注意在每个选择语句中添加类问题):
<select class ="question" id="testValues1">
<option value="right">a</option>
<option value="wrong">b</option>
<option value="wrong">c</option>
</select>
<select class="question" id="testValues2">
<option value="wrong">a</option>
<option value="right">b</option>
<option value="wrong">c</option>
</select>
<select class="question" id="testValues3">
<option value="wrong">a</option>
<option value="wrong">b</option>
<option value="right">c</option>
</select>
<button type="button" onclick="finalScore()">Submit</button>
<div id="scoreDisplay">score goes here</div>
关于Javascript 测验 - 如何计算多个选择元素中答案的分数?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34959864/