我正在做一个项目,在这个项目中,我需要创建一个简单的html页面问卷工作。已经8年多了,我没有做过任何编程。现在突然被赋予了一个项目。Stack Overflow帮助我完成了大部分项目。但现在我碰壁了。
我需要从一系列问题中随机选择一个但没有重复的问题。我使用JavaScript来显示问题,并使用此代码示例作为项目的基础。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<title>Quiz</title>
<style>
</style>
<script type="text/javascript">
var pos = 0, test, test_status, question, choice, choices, chA, chB, chC, correct = 0, randomq=0;
var questions = [
["What is 36 + 42", "64", "78", "76", "B"],
["What is 7 x 4?", "21", "27", "28", "C"],
["What is 16 / 4?", "4", "6", "3", "A"],
["What is 8 x 12?", "88", "112", "96", "C"]
];
function get(x){
return document.getElementById(x);
}
function renderQuestion(){
test = get("test");
if(pos >= questions.length){
test.innerHTML = "<h2>You got "+correct+" of "+questions.length+" questions correct</h2>";
get("test_status").innerHTML = "Test completed";
// resets the variable to allow users to restart the test
pos = 0;
correct = 0;
// stops rest of renderQuestion function running when test is completed
return false;
}
//打乱问题
random1 = Math.floor(Math.random() * (questions.length)) ;
get("test_status").innerHTML = "Question "+(pos+1)+" of "+questions.length;
question = questions[random1][0];
chA = questions[random1][1];
chB = questions[random1][2];
chC = questions[random1][3];
test.innerHTML = "<h3>"+question+"</h3>";
// the += appends to the data we started on the line above
test.innerHTML += "<input type='radio' name='choices' value='A'> "+chA+"<br>";
test.innerHTML += "<input type='radio' name='choices' value='B'> "+chB+"<br>";
test.innerHTML += "<input type='radio' name='choices' value='C'> "+chC+"<br><br>";
test.innerHTML += "<button onclick='checkAnswer()'>Submit Answer</button>";
}
function checkAnswer(){
// use getElementsByName because we have an array which it will loop through
choices = document.getElementsByName("choices");
for(var i=0; i<choices.length; i++){
if(choices[i].checked){
choice = choices[i].value;
}
}
// checks if answer matches the correct choice
if(choice == questions[random1][4]){
//each time there is a correct answer this value increases
correct++;
}
// changes position of which character user is on
pos++;
// then the renderQuestion function runs again to go to next question
renderQuestion();
}
window.addEventListener("load", renderQuestion, false);
</script>
</head>
<body>
<h2 id="test_status"></h2>
<div id="test"></div>
</body>
</html>
我正在寻找一种没有重复问题的方法。
请指教..。
提前谢谢。
https://stackoverflow.com/questions/52917253
复制相似问题