本文详解因 `currentindex` 索引错位导致多选题始终显示“0/2 正确”的核心 bug，通过调整索引更新时机、初始化值及边界处理，确保 `checkanswer()` 始终匹配当前渲染题目的数据源。
在实现多选题测验功能时，一个常见却隐蔽的错误是数据索引与 DOM 渲染状态不同步。你遇到的 "You got 0 out of 2 (0%) correct" 问题，并非逻辑判断错误，而是 checkAnswer() 函数读取了错误的 sampleData[currentIndex] —— 因为 currentIndex 在 generateContent() 中被滞后递增：它在生成题目 HTML 后才自增，而 checkAnswer() 却在点击时立即使用该已更新的索引去查找答案，结果指向了下一个（甚至越界）的数据项，造成 sampleData[currentIndex].quiz 取值为空或不匹配，最终 selectedAnswers 与 correctAnswers 长度不等或内容错位，评分恒为 0。
✅ 根本修复：索引生命周期对齐
关键修改有三处，全部围绕 currentIndex 的定义、更新时机和边界控制：
- 初始化为 -1：使首次调用 generateContent() 时 currentIndex++ 后恰好为 0，指向首个数据项；
- currentIndex++ 移至函数顶部：确保每次生成内容前，索引已准确指向待渲染的数据；
- 越界重置紧随其后：在递增后立即检查并归零，避免访问 sampleData[3] 等无效索引。
let currentIndex = -1; // ← 修改：起始为 -1
function generateContent() {
currentIndex++; // ← 修改：首行即递增
if (currentIndex >= sampleData.length) {
currentIndex = 0; // ← 修改：递增后立即校验
}
const data = sampleData[currentIndex]; // ✅ 此时 currentIndex 指向有效数据
title.textContent = data.title;
bodytext.textContent = data.bodytext;
source.textContent = "Source: " + data.source;
let quizHTML = "";
for (let i = 0; i < data.quiz.length; i++) {
quizHTML += `${data.quiz[i].question}
`;
for (let j = 0; j < data.quiz[i].choices.length; j++) {
quizHTML += `
`;
}
}
quiz.innerHTML = quizHTML;
results.textContent = "";
}
? 补充优化建议（提升健壮性）
- 大小写与空格标准化：已在 checkAnswer() 中添加 .trim().toLowerCase()，确保 "Paris " 和 "paris" 能正确匹配；
- 防重复提交：可在 checkAnswer() 开头添加 if (results.textContent) return;，避免多次点击干扰；
- 单选题命名一致性：name="answer${i}" 已正确隔离每道题的选项组，无需改动；
- 空答案防御：现有 null 检查合理，但可增强提示：“Question ${i+1} is unanswered”。
? 总结
该问题本质是状态管理失序——UI 渲染与业务逻辑对同一索引变量的读写时序未对齐。修复不在于重写评分算法，而在于让 currentIndex 始终代表“当前正在展示的题目所属的数据索引”。遵循“先更新、再读取、后渲染”原则，即可彻底解决评分归零问题。此模式也适用于轮播内容、分页表单等所有依赖共享索引的状态驱动场景。
立即学习“Java免费学习笔记（深入）”；
