要编写一个用于刷题的HTML页面，需要实现以下功能：
记录每道题正确或错误的次数。
如果正确次数多于一定值，则可以跳过该道题目。
这个功能可以通过使用JavaScript实现，并存储数据在浏览器端，例如使用LocalStorage。
HTML代码：
<!DOCTYPE html>
<html>
<head>
<title>刷题页面</title>
</head>
<body>
<div id="question"></div>
<button id="correct">正确</button>
<button id="incorrect">错误</button>
</body>
<script>
const question = document.getElementById("question");
const correctBtn = document.getElementById("correct");
const incorrectBtn = document.getElementById("incorrect");
let questions = [
{ content: "题目1" },
{ content: "题目2" },
{ content: "题目3" },
];
let currentQuestion = 0;
let skipThreshold = 2;
function renderQuestion() {
if (currentQuestion >= questions.length) return;
question.innerHTML = questions[currentQuestion].content;
}
function updateQuestionStatus(isCorrect) {
let key = `question-${currentQuestion}`;
let status = localStorage.getItem(key);
if (!status) {
status = { correct: 0, incorrect: 0 };
} else {
status = JSON.parse(status);
}
if (isCorrect) {
status.correct++;
} else {
status.incorrect++;
}
localStorage.setItem(key, JSON.stringify(status));
}
function checkAndGoToNextQuestion() {
let key = `question-${currentQuestion}`;
let status = localStorage.getItem(key);
if (!status) {
currentQuestion++;
renderQuestion();
return;
}
status = JSON.parse(status);
if (status.correct >= skipThreshold) {
currentQuestion++;
}
renderQuestion();
}
correctBtn.addEventListener("click", () => {
updateQuestionStatus(true);
checkAndGoToNextQuestion();
});
incorrectBtn.addEventListener("click", () => {
updateQuestionStatus(false);
checkAndGoToNextQuestion();
1717
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
