JS代码-只有我的问题可以在测验中上传,而答案选项则不能

时间:2018-10-01 17:12:32

标签: javascript

我正在尝试建立一个不止一个问题的测验,每个问题只有4个选项,而答案只有1个。

我建立了一个HTML空容器,因此感谢JS,下一个问题可以在提交答案后自动上传。但是仅出现问题,而这4个选项均未出现。 我在JS上使用此代码,请您帮我发现错误?

var currentQuestion = 0;
var score = 0;
var totQuestionScore = questions.length;

var container = document.getElementById('quizContainer');
var questionEl = document.getElementById('question');
var opt1 = document.getElementById('opt1');
var opt2 = document.getElementById('opt2');
var opt3 = document.getElementById('opt3');
var opt4 = document.getElementById('opt4');
var nextButton = document.getElementById('nextButton');
var resultCont = document.getElementById('result');

function loadQuestion (questionIndex) {
  var q = questions[questionIndex];
  questionEl.textContent = q.question;
  opt1.textcontent = q.option1;
  opt2.textcontent = q.option2;
  opt3.textcontent = q.option3;
  opt4.textcontent = q.option4;
};

function loadNextQuestion () {
  var selectOption = document.querySelector('input [type=radio]:checked');
  if(!selectOption){
    alert('Please select your answer.');
    return;
  }
  var answer = selectOption.value;
  if(questions[currentQuestion].answer == answer){
    score += 10;
  }
  selectOption.checked = false;
  currentQuestion++;
  if(currentQuestion == totQuestions - 4){
    nextButton.textContent = 'Finish';
  }
  if(currentQuestion == totQuestions){
    container.style.display = 'none';
    resultCont.style.display = '';
    resultCont.textcontent = 'Your score is' + score + 'out of 4';
    return
  }
  loadQuestion(currentQuestion);
}
loadQuestion(currentQuestion);

1 个答案:

答案 0 :(得分:0)

opt1.textcontent不会opt1.textContent吗?请记住,JavaScript区分大小写。