Javascript 如何显示调查的答案选项？

因此，我为我的网站编写了一份问卷/调查，但由于某些原因，当用户单击“开始问卷”时，会显示问题，但不会显示选项。我真的很困惑为什么这不起作用。如果有人能帮我解决我的问题，我将非常感激，谢谢

这里有一个指向我的IDE的链接，因为我认为通过它可以更容易地识别我所犯的任何错误：

以下是start inventory.js文件：

function buttonClicked(button) {
  button.style.visibility = "hidden";
  startSurvey();
  console.log("Survey started.");
}

function startSurvey() {

  var i;
  var j;
  var k;
  for (i = 0; i < ourQuestions.length; i++) {
    document.getElementById("questions").innerHTML += '<form id="question">Q' + (i + 1) + ': ' + ourQuestions[i].question;

    for (j = 0; j < ourQuestions[i].answers.length; j++) {
      document.forms[i].innerHTML += '</div><div class="answer"><input name="q1" value="' + ourQuestions[i].answers[j] + '" id="value4" type="checkbox" />' + ourQuestions[i].answers[j] + '<br/>';
    }
    document.getElementById("questions").innerHTML += '</form><br/><br/>';
  }

  document.getElementById("questions").innerHTML += '<button class="button" onclick="solveQuiz()">Solve Quiz</button>';

}

var ourQuestions = [{
    question: 'While naturally occurring wildfires can benefit ecosystems, unnatural blazes started by uncaring and negligent humans can do great harm and cause many deaths. What percentage of wildfires do you think are started by humans?',
    answers: {
      a: '10-15%',
      b: '85-90%',
      c: '45-50%',
      d: '25-30%'
    },
    correctAnswer: 'b'
  },
  {
    question: 'If you have lit a campfire before, how did you extinguish it?',
    answers: {
      a: 'I did not extinguish it and waited for it to die on its own',
      b: 'I extinguished the campfire with a bucket of water and made sure it was fully extinguished.',
      c: 'I have never lit a campfire before.',
      d: 'uhhh'
    },
    correctAnswer: 'b'
  },
  {
    question: 'What are the two most common reasons that forest fires start?',
    answers: {
      a: 'Lightning and human negligence',
      b: 'Spontaneous combustion and erosion',
      c: 'Animals igniting flames and overcrowded bushlands',
      d: 'Strong Wind Patterns'
    },
    correctAnswer: 'a'
  },
  {
    question: 'What time of the year do most forest fires occur?',
    answers: {
      a: 'Summer',
      b: 'Spring',
      c: 'Fall',
      d: 'Winter'
    },
    correctAnswer: 'a'
  },
  {
    question: 'How fast do you think forest fires spread?',
    answers: {
      a: '10.8 km/h',
      b: '6.4 km/h',
      c: '22.2 km/h',
      d: '3.2 km/h'
    },
    correctAnswer: 'a'
  },
  {
    question: 'What do forest fires need in order to burn?',
    answers: {
      a: 'Water',
      b: 'High humidity',
      c: 'Fuel',
      d: 'Clear weather'
    },
    correctAnswer: 'c'
  },
  {
    question: 'What is one of the main toxic gases present in forest fire smoke?',
    answers: {
      a: 'Osmium tetroxide',
      b: 'Disulfur decafluoride',
      c: 'Tungsten hexafluoride ',
      d: 'carbon monoxide'
    },
    correctAnswer: 'd'
  },
  {
    question: 'What natural disasters could be caused as a consequence of a destructive forest fire?',
    answers: {
      a: 'Erosion, flash flooding and landslides',
      b: 'Tornadoes',
      c: 'Snow',
      d: 'Tsunami and earthquakes'
    },
    correctAnswer: 'a'
  },
  {
    question: 'What major factor determines a forest fire’s behaviour?',
    answers: {
      a: 'Amount of water vapour in air',
      b: 'Density of Forests',
      c: 'Wind',
      d: 'Hours of sunlight'
    },
    correctAnswer: 'c'
  },
  {
    question: 'What 3 things are needed to start a fire?',
    answers: {
      a: 'Matches, oxygen, wood',
      b: 'Air and sunlight',
      c: 'Fuel, heat, oxygen',
      d: 'Fuel, oxygen, wood'
    },
    correctAnswer: 'c'
  },
  {
    question: 'Which one of these is NOT a type of forest fire?',
    answers: {
      a: 'Crown',
      b: 'Firework',
      c: 'Surface',
      d: 'Ground '
    },
    correctAnswer: 'b'
  },
  {
    question: 'What was the cause of the Amazon forest fires in 2019?',
    answers: {
      a: 'Deforestation for agriculture usage',
      b: 'Fireworks',
      c: 'Unattended campfire',
      d: 'Arson'
    },
    correctAnswer: 'a'
  },
  {
    question: 'Which one of these names are NOT an alternate name for forest fires?',
    answers: {
      a: 'Wildfires',
      b: 'Shrub fires',
      c: 'Natural fireworks',
      d: 'Brushfires '
    },
    correctAnswer: 'c'
  },
  {
    question: 'How many forest fires occurred in 2019?',
    answers: {
      a: '25 653',
      b: '50 477',
      c: '45 809',
      d: '89 431'
    },
    correctAnswer: 'b'
  }
];



function solveSurvey() {
  var x;
  var txt = ' ';
  var i = 0;
  var correct = 0;
  for (i = 0; i < document.forms.length; i++) {
    x = document.forms[i];
    for (j = 0; j < x.length; j++) {
      if (x[j].checked) {
        correctAnswer = ourQuestions[i].correctAnswer;
        if (x[j].value == ourQuestions[i].answers[correctAnswer]) {
          correct += 1;
        }
      }
    }
      document.forms[i].innerHTML += '</div><div class="answer"><input name="q1" value="' + ourQuestions[i].answers[j] + '" id="value4" type="radio" />' + ourQuestions[i].answers[j] + '<br/>';
  }
  document.getElementById("questions").innerHTML += 'Correct answers: ' + correct;
  

}

功能按钮点击（按钮）{
button.style.visibility=“hidden”；
startSurvey（）；
log（“调查已开始”）；
}
函数startSurvey（）{
var i；
var j；
var-k；
对于（i=0；i；
}
document.getElementById（“问题”）.innerHTML+='

'；
}
document.getElementById（“问题”）.innerHTML+=“解决测验”；
}
所有问题=[{
问：“虽然自然发生的野火有利于生态系统，但由不关心和疏忽的人类引发的非自然火灾会造成巨大伤害，并导致许多人死亡。你认为有多大比例的野火是由人类引发的？”，
答复:{
答：10-15%，
b:‘85-90%’，
c:‘45-50%’，
d:‘25-30%’
},
正确答案：“b”
},
{
问题：“如果你以前点燃过篝火，你是如何熄灭的？”，
答复:{
答：“我没有熄灭它，而是等待它自己死去。”，
b：“我用一桶水扑灭了营火，并确保它完全熄灭。”，
c:“我以前从未点过营火。”，
d:‘嗯’
},
正确答案：“b”
},
{
问：“森林火灾发生的两个最常见的原因是什么？”，
答复:{
答：“闪电和人为疏忽”，
b:‘自燃和侵蚀’，
c:“动物点燃火焰和过度拥挤的丛林地带”，
d:‘强风模式’
},
正确答案：“a”
},
{
问题：“一年中大多数森林火灾发生在什么时候？”，
答复:{
a:‘夏天’，
b:‘春天’，
c:‘秋天’，
d:‘冬天’
},
正确答案：“a”
},
{
问：“你认为森林火灾蔓延的速度有多快？”，
答复:{
a:‘10.8公里/小时’，
b:‘6.4公里/小时’，
c:‘22.2公里/小时’，
d:‘3.2公里/小时’
},
正确答案：“a”
},
{
问题：“森林火灾需要什么才能燃烧？”，
答复:{
a:‘水’，
b:‘高湿度’，
c:‘燃料’，
d:‘晴朗的天气’
},
正确答案：“c”
},
{
问：“森林火灾烟雾中的主要有毒气体是什么？”，
答复:{
a:‘四氧化锇’，
b:‘十氟化二硫’，
c:‘六氟化钨’，
d:‘一氧化碳’
},
正确答案：“d”
},
{
问题：“破坏性森林火灾可能导致哪些自然灾害？”，
答复:{
答：“侵蚀、山洪暴发和滑坡”，
b:‘龙卷风’，
c:‘雪’，
d:“海啸和地震”
},
正确答案：“a”
},
{
问题：“决定森林火灾行为的主要因素是什么？”，
答复:{
a:‘空气中的水蒸气量’，
b:‘森林密度’，
c：‘风’，
d:‘日照时间’
},
正确答案：“c”
},
{
问题：“点火需要哪三样东西？”，
答复:{
a:‘火柴、氧气、木头’，
b:‘空气和阳光’，
c:‘燃料、热量、氧气’，
d:‘燃料、氧气、木材’
},
正确答案：“c”
},
{
问题：“哪一种不是森林火灾？”，
答复:{
a:‘皇冠’，
b:‘烟火’，
c:‘表面’，
d:‘地面’
},
正确答案：“b”
},
{
问题：“2019年亚马逊森林大火的原因是什么？”，
答复:{
a:“毁林用于农业”，
b:‘烟火’，
c:“无人值守营火”，
d:“纵火”
},
正确答案：“a”
},
{
问题：“这些名称中哪一个不是森林火灾的替代名称？”，
答复:{
a:‘野火’，
b:‘灌木火灾’，
c:‘天然烟花’，
d:‘灌木丛火’
},
正确答案：“c”
},
{
问题：“2019年发生了多少次森林火灾？”，
答复:{
a:‘25653’，
b:‘50477’，
c:‘45809’，
d:'89431'
},
正确答案：“b”
}
];
职能调查（）{
var x；
var-txt=''；
var i=0；
var=0；
对于（i=0；i；
}
document.getElementById（“问题”）.innerHTML+=“正确答案：”+正确；
}

以下是inventory.HTML文件：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>Forest Firefighters: Questionnaire</title>
    <link href="survey style.css" rel="stylesheet" type="text/css" />
    <link href="main style.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.13.0/css/all.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script src="script.js" type="text/javascript"></script>
    <script src="start questionnaire.js" type="text/javascript"></script>
  </head>
  
  <body>
    <!--────────────────Header───────────────-->
      <header>
          <nav> 
            <ul class="nav-bar"><div class="bg"></div>
                <li><a class="nav-link" href="about.html">About</a></li>
                <li><a class="nav-link" href="index.html">Home</a></li>
                <li><a class="nav-link active" href="questionnaire.html">Questionnaire</a></li>
              <li><a class="nav-link" href="learning more.html">Learning more</a></li>
          <li><a class="nav-link" href="">Ways you can help</a></li>
            </ul>
          </nav>
      </header>

    <main>
        <!--─────────────────Home────────────────-->
        <div id="home">
            <div class="filter"></div>

        <!--────questionnaire button─────-->        
        <button class="button" onclick="buttonClicked(this)">Start Questionnaire</button>
        <spacer></spacer>
        <div id="questions"></div>
        <spacer></spacer>
        <spacer></spacer>
        </div>
    
      
          <div class="citing">
        <a class="citing-link" href=questionnaire.html">Image Source: https://phys.org/news/2019-11-countries-forest.html</a>
      <div>      
      </main>  

    <!--─────────────────Footer────────────────-->
      <footer class="copyright">© 2020 Amber, Aatiqah, Selina</footer>
  </body>

</html>

森林消防员：问卷调查







开始调查问卷
©2020琥珀色，塞利纳阿提卡

我在上运行了它，得到了以下错误：

“ReferenceError:未定义buttonClicked”

你有一些格式问题，我

  <body >
  <button class="button" onclick="buttonClicked(this)">Start Questionnaire</button>

answers: {
      a: '10-15%',
      b: '85-90%',
      c: '45-50%',
      d: '25-30%'
}

for (j = 0; j < ourQuestions[i].answers.length; j++)

document.getElementById('questions').innerHTML +=
    '<button class="button" onclick="solveSurvey()">Solve Quiz</button>';
}

function buttonClicked(button) {
  button.style.visibility = 'hidden';
  startSurvey();
  console.log('Survey started.');
}

function startSurvey() {
  var i;
  var j;
  var k;
  for (i = 0; i < ourQuestions.length; i++) {
    document.getElementById('questions').innerHTML +=
      '<form id="question">Q' + (i + 1) + ': ' + ourQuestions[i].question;
    debugger;
    for (let [key, value] of Object.entries(ourQuestions[i].answers)) {
      document.forms[i].innerHTML +=
        '</div><div class="answer"><input name="q1" value="' +
        value +
        '" id="value4" type="checkbox" />' +
        `${key}: '${value}'`; //use a string literal, makes a dev's life very easy
      ('<br/>');
    }
    document.getElementById('questions').innerHTML += '</form><br/><br/>';
  }

  document.getElementById('questions').innerHTML +=
    '<button class="button" onclick="solveSurvey()">Solve Quiz</button>';
}

var ourQuestions = [
  {
    question:
      'While naturally occurring wildfires can benefit ecosystems, unnatural blazes started by uncaring and negligent humans can do great harm and cause many deaths. What percentage of wildfires do you think are started by humans?',
    answers: {
      a: '10-15%',
      b: '85-90%',
      c: '45-50%',
      d: '25-30%',
    },
    correctAnswer: 'b',
  },
  {
    question: 'If you have lit a campfire before, how did you extinguish it?',
    answers: {
      a: 'I did not extinguish it and waited for it to die on its own',
      b:
        'I extinguished the campfire with a bucket of water and made sure it was fully extinguished.',
      c: 'I have never lit a campfire before.',
      d: 'uhhh',
    },
    correctAnswer: 'b',
  },
  {
    question: 'What are the two most common reasons that forest fires start?',
    answers: {
      a: 'Lightning and human negligence',
      b: 'Spontaneous combustion and erosion',
      c: 'Animals igniting flames and overcrowded bushlands',
      d: 'Strong Wind Patterns',
    },
    correctAnswer: 'a',
  },
  {
    question: 'What time of the year do most forest fires occur?',
    answers: {
      a: 'Summer',
      b: 'Spring',
      c: 'Fall',
      d: 'Winter',
    },
    correctAnswer: 'a',
  },
  {
    question: 'How fast do you think forest fires spread?',
    answers: {
      a: '10.8 km/h',
      b: '6.4 km/h',
      c: '22.2 km/h',
      d: '3.2 km/h',
    },
    correctAnswer: 'a',
  },
  {
    question: 'What do forest fires need in order to burn?',
    answers: {
      a: 'Water',
      b: 'High humidity',
      c: 'Fuel',
      d: 'Clear weather',
    },
    correctAnswer: 'c',
  },
  {
    question:
      'What is one of the main toxic gases present in forest fire smoke?',
    answers: {
      a: 'Osmium tetroxide',
      b: 'Disulfur decafluoride',
      c: 'Tungsten hexafluoride ',
      d: 'carbon monoxide',
    },
    correctAnswer: 'd',
  },
  {
    question:
      'What natural disasters could be caused as a consequence of a destructive forest fire?',
    answers: {
      a: 'Erosion, flash flooding and landslides',
      b: 'Tornadoes',
      c: 'Snow',
      d: 'Tsunami and earthquakes',
    },
    correctAnswer: 'a',
  },
  {
    question: 'What major factor determines a forest fire’s behaviour?',
    answers: {
      a: 'Amount of water vapour in air',
      b: 'Density of Forests',
      c: 'Wind',
      d: 'Hours of sunlight',
    },
    correctAnswer: 'c',
  },
  {
    question: 'What 3 things are needed to start a fire?',
    answers: {
      a: 'Matches, oxygen, wood',
      b: 'Air and sunlight',
      c: 'Fuel, heat, oxygen',
      d: 'Fuel, oxygen, wood',
    },
    correctAnswer: 'c',
  },
  {
    question: 'Which one of these is NOT a type of forest fire?',
    answers: {
      a: 'Crown',
      b: 'Firework',
      c: 'Surface',
      d: 'Ground ',
    },
    correctAnswer: 'b',
  },
  {
    question: 'What was the cause of the Amazon forest fires in 2019?',
    answers: {
      a: 'Deforestation for agriculture usage',
      b: 'Fireworks',
      c: 'Unattended campfire',
      d: 'Arson',
    },
    correctAnswer: 'a',
  },
  {
    question:
      'Which one of these names are NOT an alternate name for forest fires?',
    answers: {
      a: 'Wildfires',
      b: 'Shrub fires',
      c: 'Natural fireworks',
      d: 'Brushfires ',
    },
    correctAnswer: 'c',
  },
  {
    question: 'How many forest fires occurred in 2019?',
    answers: {
      a: '25 653',
      b: '50 477',
      c: '45 809',
      d: '89 431',
    },
    correctAnswer: 'b',
  },
];

function solveSurvey() {
  var x;
  var txt = ' ';
  var i = 0;
  var correct = 0;
  for (i = 0; i < document.forms.length; i++) {
    x = document.forms[i];
    for (j = 0; j < x.length; j++) {
      if (x[j].checked) {
        correctAnswer = ourQuestions[i].correctAnswer;
        if (x[j].value == ourQuestions[i].answers[correctAnswer]) {
          correct += 1;
        }
      }
    }
    document.forms[i].innerHTML +=
      '</div><div class="answer"><input name="q1" value="' +
      ourQuestions[i].answers[j] +
      '" id="value4" type="radio" />' +
      ourQuestions[i].answers[j] +
      '<br/>';
  }
  document.getElementById('questions').innerHTML +=
    'Correct answers: ' + correct;
}