我正在制作一个测验应用程序,我试图每次进入下一个问题时都会增加问题编号并得分。当他们得到对或错时,还要回馈一些供稿。任何提示都将不胜感激。编码的新事物,并真正试图弄清楚这一切
let currentQuestion = 0;
let score = 1;
function renderQuestion() {
document.getElementById("quiz").innerHTML =
`
<fieldset>
<legend> ${questions[currentQuestion].question} </legend>
<input type="radio" name="option"
value="A">${questions[currentQuestion].options[0].option}<br>
<input type="radio" name="option"
value="B">${questions[currentQuestion].options[1].option}<br>
<input type="radio" name="option"
value="C">${questions[currentQuestion].options[2].option}<br>
<input type="radio" name="option"
value="D">${questions[currentQuestion].options[3].option}<br>
<button id="button" class="submitAnswer"> Submit answer </button>
<div id="errorMessage">
</div>
<div id="feed">
</div>
</fieldset>
`;
document.getElementById("button").addEventListener("click",
function(event) {
event.preventDefault();
let hasAnswer = false;
for (let el of document.querySelectorAll("input")) {
if (el.checked) {
hasAnswer = true;
if (el.value === questions[currentQuestion].answer)
{
score++;
}
}
}
if (hasAnswer) {
if (currentQuestion === questions.length - 1) {
document.getElementById("quiz").innerHTML = `Your score is
${score}`;
}
else {
currentQuestion++;
renderQuestion();
}
}
else {
document.getElementById("errorMessage").innerHTML = "Please
select an answer!";
}
});
}
renderQuestion();
如果您想每次移动下一个问题时都会增加分数,那么最简单的方法是添加此问题:
score++;
里面:
else {
currentQuestion++;
score++;
renderQuestion();
}
在此块内:
if (hasAnswer) {
if (currentQuestion === questions.length - 1) {
document.getElementById("quiz").innerHTML = `Your score is
${score}`;
}
else {
currentQuestion++;
score++;
renderQuestion();
}
}
else {
document.getElementById("errorMessage").innerHTML = "Please
select an answer!";
}
希望这会有所帮助!