测验程序未按预期运行
2016-06-09
69
我正在尝试创建一个测验程序。单击按钮时,每个问题对象都会加载到页面。我有代码,但它不起作用。不知道哪里出了问题。有人可以帮忙吗?我想通过单击按钮来控制循环,这样我就可以得到第一个问题,然后单击下一个问题,依此类推。
var quiz = document.quiz;
var nextButton = document.getElementById('nextButton');
var questions =
[
{
question: "What is the color of skye?",
choices : ["Blue", "White", "Yellow", "Green"],
answer : 0
},
{
question: "What is the color of skye?",
choices : ["Blue", "White", "Yellow", "Green"],
answer : 0
}
];
var counter = 0;
nextButton.onclick = function () {
while ( counter < questions.length ) {
var question = questions[counter].question;
var choices = questions[counter].choices;
var answer = questions[counter].answer;
answer = choices[answer];
print( question, choices, answer );
counter++;
}
};
function print ( question , choices , answer ) {
var html = "";
html += "</h3>" + question + "</h3>";
for ( var option in choices ) {
html += "<input type='radio' name='option'>" + choices[option] + "</input>";
html += "<br>";
}
quiz.innerHTMl = html;
}
<!DOCTYPE html>
<html>
<head>
<title> Quiz </title>
</head>
<body>
<form action="" name="quiz"></form>
<form action="" name="controls">
<input type="button" value="Next" id="nextButton">
</form>
<script src="quiz.js"></script>
</body>
</html>
1个回答
这里是您的代码示例 https://jsfiddle.net/r1kcL1pc/
quiz.innerHTMl = html;
此行必须更改为
quiz.innerHTML = html;
只有一个字母:)
然后,我删除了 while 循环,因此您每次单击按钮时都可以更改问题。
giuseppe straziota
2016-06-09