javascript - 未捕获的类型错误:无法读取未定义的属性“rightAnswer”
问题描述
我想使用这个带有 4 个选项的 codepen pen,我编辑了 js 代码,起初几个答案它工作正常,但在几个问题之后我得到了这个错误。问题是我的 4 个选项。因为它有 3 个选项可以正常工作。
错误:
未捕获的类型错误:无法 在 HTMLButtonElement.onclick (index.html:204) 的 answerA_clicked (index.js:1082)的
checkAnswer (index.js:1113)处读取未定义的属性“rightAnswer” (这是答案按钮)
代码笔 JS
//variables
var quiz = [];
quiz[0] = new Question("What is 1/4 of 100?", "25", "24", "23");
quiz[1] = new Question("What color is blood?", "Red", "White", "Green");
quiz[2] = new Question("What color is grass?", "Green", "White", "Red");
quiz[3] = new Question("How many legs does a spider have?", "8", "6", "4");
quiz[4] = new Question("Who is the king of the Netherlands?", "Willem-Alexander", "Willem-Alexzelf", "Willem-Alexniemand");
quiz[5] = new Question("What is 2-2?", "0", "2", "4");
quiz[6] = new Question("What was Vincent van Gogh?", "Artist", "Baker", "Jobless");
var randomQuestion;
var answers = [];
var currentScore = 0;
document.addEventListener("DOMContentLoaded", function(event) {
btnProvideQuestion();
});
function Question(question,rightAnswer,wrongAnswer1,wrongAnswer2) {
this.question = question;
this.rightAnswer = rightAnswer;
this.wrongAnswer1 = wrongAnswer1;
this.wrongAnswer2 = wrongAnswer2;
};
function shuffle(o) {
for(var j, x, i = o.length; i; j = parseInt(Math.random() * i), x = o[--i], o[i] = o[j], o[j] = x);
return o;
};
function btnProvideQuestion() {
var randomNumber = Math.floor(Math.random()*quiz.length);
randomQuestion = quiz[randomNumber]; //getQuestion
answers = [randomQuestion.rightAnswer, randomQuestion.wrongAnswer1, randomQuestion.wrongAnswer2];
shuffle(answers);
document.getElementById("question").innerHTML= randomQuestion.question;
document.getElementById("answerA").value= answers[0];
document.getElementById("answerA").innerHTML= answers[0];
document.getElementById("answerB").value= answers[1];
document.getElementById("answerB").innerHTML= answers[1];
document.getElementById("answerC").value= answers[2];
document.getElementById("answerC").innerHTML= answers[2];
}
function answerA_clicked() {
var answerA = document.getElementById("answerA").value;
checkAnswer(answerA);
}
function answerB_clicked() {
var answerB = document.getElementById("answerB").value;
checkAnswer(answerB);
}
function answerC_clicked() {
var answerC = document.getElementById("answerC").value;
checkAnswer(answerC);
}
function adjustScore(isCorrect) {
debugger;
if (isCorrect) {
currentScore++;
} else {
if (currentScore > 0) {
currentScore--;
}
}
document.getElementById("score").innerHTML = currentScore;
}
function checkAnswer(answer) {
if (answer == randomQuestion.rightAnswer) {
adjustScore(true);
btnProvideQuestion();
} else {
alert("Loser!");
adjustScore(false);
}
}
这就是我编辑的js(我想添加假分数,所以WScore是关于假分数)
var quiz = [];
....
....
...[note: So many question in here]
quiz[1187] = new Question("Vincent van Gogh", "1853", "1859", "1844", "1841");
var randomQuestion;
var answers = [];
var currentScore = 0;
var currentWScore = 0;
document.addEventListener("DOMContentLoaded", function(event) {
btnProvideQuestion();
});
function Question(question,rightAnswer,wrongAnswer1,wrongAnswer2,wrongAnswer3) {
this.question = question;
this.rightAnswer = rightAnswer;
this.wrongAnswer1 = wrongAnswer1;
this.wrongAnswer2 = wrongAnswer2;
this.wrongAnswer3 = wrongAnswer3;
};
function shuffle(o) {
for(var j, x, i = o.length; i; j = parseInt(Math.random() * i), x = o[--i], o[i] = o[j], o[j] = x);
return o;
};
function btnProvideQuestion() {
var randomNumber = Math.floor(Math.random()*quiz.length);
randomQuestion = quiz[randomNumber]; //getQuestion
answers = [randomQuestion.rightAnswer, randomQuestion.wrongAnswer1, randomQuestion.wrongAnswer2, randomQuestion.wrongAnswer3];
shuffle(answers);
document.getElementById("question").innerHTML= randomQuestion.question;
document.getElementById("answerA").value= answers[0];
document.getElementById("answerA").innerHTML= answers[0];
document.getElementById("answerB").value= answers[1];
document.getElementById("answerB").innerHTML= answers[1];
document.getElementById("answerC").value= answers[2];
document.getElementById("answerC").innerHTML= answers[2];
document.getElementById("answerD").value= answers[3];
document.getElementById("answerD").innerHTML= answers[3];
}
function answerA_clicked() {
var answerA = document.getElementById("answerA").value;
[1082 LİNE] checkAnswer(answerA);
}
function answerB_clicked() {
var answerB = document.getElementById("answerB").value;
checkAnswer(answerB);
}
function answerC_clicked() {
var answerC = document.getElementById("answerC").value;
checkAnswer(answerC);
}
function answerD_clicked() {
var answerD = document.getElementById("answerD").value;
checkAnswer(answerD);
}
function adjustScore(isCorrect) {
debugger;
if (isCorrect) {
currentScore++;
} else {
currentWScore++;
}
document.getElementById("score").innerHTML = currentScore;
document.getElementById("Wscore").innerHTML = currentWScore;
}
[1113 LİNE] function checkAnswer(answer) {
if (answer == randomQuestion.rightAnswer) {
swal({
title: "Right!",
type: "success",
allowOutsideClick: "on",
timer: "850",
showConfirmButton: false,
html: true
});
adjustScore(true);
btnProvideQuestion();
}
else {
if (checkoutHistory.checked) {
swal({
title: "Wrong",
type: "error",
confirmButtonColor: "#3498db",
confirmButtonText: "Next",
customClass: "sweetAlertModal",
allowOutsideClick: "on",
html: true
});
adjustScore(false);
btnProvideQuestion();
} else {
swal({
title: "Wrong!",
type: "error",
confirmButtonColor: "#3498db",
confirmButtonText: "Next",
customClass: "sweetAlertModal",
html: true
});
adjustScore(false);
btnProvideQuestion();
}
}
}
解决方案
推荐阅读
- react-native - 当键盘弹出时,第二个选项卡中的 TextInput 不会向上移动 react-navigation createMaterialTopTabNavigator
- h3 - 有多少种可能的 H3 GeoBoundary 顶点配置?
- python - 多个子类继承其超类的一个实例
- javascript - 在数组元素之间过滤
- android - 动态更新柱形图抛出 UnsupportedOperationException
- c++ - 如何在没有 new 的情况下在派生对象中使用虚函数?
- reactjs - 错误:“类型“{}”缺少类型中的以下属性
- javascript - 使用 jQuery load() 加载多个 ID - 更好的方法
- spring-cloud - ZuulException:本地运行的Spring Cloud中的转发错误
- ubuntu - 在 ubuntu 上运行的 Kubernetes POD 中 DNS 解析失败