
本文旨在解决JavaScript Trivia游戏中答案判断始终返回第一个答案为正确的错误。通过分析问题代码,找出`checkAnswer`函数中`currentQuestion`变量的错误使用,并提供修改后的代码示例,帮助开发者理解和修复类似问题,确保Trivia游戏逻辑的正确性。
在开发Trivia游戏时,一个常见的错误是答案判断逻辑不正确,导致无论选择哪个答案,程序总是认为第一个答案是正确的。这通常是因为在答案检查函数中,对当前问题的索引处理不当。以下将详细分析问题原因,并提供解决方案。
问题分析
在提供的代码片段中,checkAnswer函数存在一个关键错误:
立即学习“Java免费学习笔记(深入)”;
function checkAnswer(bntIndex) { nextButton.classList.remove('hide'); const currentQuestion = 0; // 错误:总是使用第一个问题 answer = questions[currentQuestion].answers[bntIndex]; if(answer.correct === true) { incrementPoints(); result.textContent = "Correct!"; } else { result.textContent = "Incorrect"; }}
该函数定义了一个常量 currentQuestion 并将其赋值为 0。这意味着无论用户点击哪个答案按钮,checkAnswer 函数总是会检查 questions 数组中第一个问题的答案,导致只有第一个问题的第一个答案才会被判定为正确。
解决方案
要解决这个问题,需要将 currentQuestion 变量替换为实际当前问题的索引。由于 randomQuestion 变量在 nextQuestion 函数中存储了当前问题,因此可以直接使用 randomQuestion 来访问当前问题的答案。
修改后的 checkAnswer 函数如下:
function checkAnswer(bntIndex) { nextButton.classList.remove('hide'); // const currentQuestion = 0; // 删除此行 answer = randomQuestion.answers[bntIndex]; // 使用 randomQuestion if(answer.correct === true) { incrementPoints(); result.textContent = "Correct!"; } else { result.textContent = "Incorrect"; }}
完整代码示例 (包含上下文)
为了更好地理解修改后的代码,这里提供一个包含上下文的完整示例:
Trivia Game const questionText = document.getElementById('question'); const answersContainer = document.getElementById('answers'); const nextButton = document.getElementById('next-button'); const result = document.getElementById('result'); let questions = [ { question: '10 + 5 equals:', answers: [ { text: '5', correct: false }, { text: '10', correct: false }, { text: '20', correct: false }, { text: '15', correct: true } ] }, { question: '2 + 2 equals:', answers: [ { text: '3', correct: false }, { text: '4', correct: true }, { text: '5', correct: false }, { text: '6', correct: false } ] } ]; let randomQuestion; nextButton.addEventListener('click', nextQuestion); function startGame() { nextQuestion(); } function nextQuestion() { nextButton.classList.add('hide'); randomQuestion = questions[Math.floor(Math.random()*questions.length)]; questionText.textContent = randomQuestion.question; randomQuestion.answers.forEach((answer, index) => { document.getElementById(`answers-btn-${index + 1}`).textContent = answer.text; result.textContent = ""; }); } function checkAnswer(bntIndex) { nextButton.classList.remove('hide'); // const currentQuestion = 0; // 删除此行 answer = randomQuestion.answers[bntIndex]; // 使用 randomQuestion if(answer.correct === true) { incrementPoints(); result.textContent = "Correct!"; } else { result.textContent = "Incorrect"; } } function incrementPoints() { // 在这里实现你的积分逻辑 console.log("Correct answer!"); } startGame();
注意事项
确保 randomQuestion 在 checkAnswer 函数被调用时已经正确赋值。incrementPoints 函数需要根据你的游戏逻辑进行实现。这个例子只是一个基础框架,可以根据需求进行扩展和优化。
总结
通过移除 checkAnswer 函数中错误的 currentQuestion 变量,并使用 randomQuestion 来访问当前问题的答案,可以解决Trivia游戏中答案判断错误的问题。在开发过程中,仔细检查变量的作用域和赋值,可以避免类似错误的发生。 调试是软件开发过程中必不可少的一环, 善于利用 console.log 等工具可以帮助我们快速定位和解决问题。
以上就是JavaScript Trivia游戏答案判断错误问题排查与修复的详细内容,更多请关注创想鸟其它相关文章!
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1583934.html
微信扫一扫
支付宝扫一扫