首页 > 解决方案 > 未捕获的类型错误:无法读取未定义的属性“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();
  }	  
  }	  
}

标签: javascriptjqueryhtml

解决方案


推荐阅读