如何使用文本框形式添加开放式问题 Javascript

Question

我希望更改我发现的以下代码，并添加带有教科书或框的问题，用户可以填写答案而不是仅选择多项。但是，每次我尝试添加代码是否损坏时。我已经复制了代码并删除了除 3 个问题之外的所有问题。我该如何修改它？

var quizzes = [
  {
    name: "test",
    questions: [
      {
        text: "Test1?",
        choices: [
          { text: "1", correct: false },
          { text: "2", correct: true },
          { text: "3", correct: false },
        ],
      },
      {
        text: "test2",
        choices: [
          { text: "4", correct: false },
          { text: "5", correct: false },
          { text: "6", correct: true },
        ],
      },
      {
        text: "Test3",
        choices: [
          { text: "7", correct: true },
          { text: "8", correct: false },
          { text: "9", correct: false },
        ],
      },
      {
    ]
  

// When the document is ready
window.addEventListener('DOMContentLoaded', function() {
  var $container = document.getElementById('container');
  // Initialize each quiz into the container
  quizzes.forEach(function(quiz) { initQuiz(quiz, $container); });
});

function initQuiz(quiz, $container) {
  // DOM elements
  var $dom = initDOM(quiz, $container),
  // Current question index (starts at 0)
      num = 0,
      score = 0;
  
  nextScreen();
  
  function nextScreen() {
    if (num < quiz.questions.length) {
      displayQuestion();
    } else {
      displayEndResult();
    }
  }
  
  function displayQuestion() {
    clearDisplayArea();
    var question = quiz.questions[num];
    
    // Display the image if there is one
    if (question.image) {
      $dom.display.innerHTML = '<img src="' + question.image + '" class="question-img"/>';
    }
    // Display the question
    $dom.display.innerHTML +=
        '<p>Q' + (num+1) + ': ' + question.text + '</p>'
      + question.choices.map(function(choice, i) {
         return '<label>'
              +   '<input type="radio" name="' + quiz.name + '" value="' + i + '"/>'
              +   choice.text
              + '</label>';
       return  '<form>'
              +   '<input type = "text" id="textbook" name="'  + quiz.name + '" value="' + i + '"/>'
              +   textbox.text  
              + '</form>' ;
       }).join('')
      + '<br>';
    
    // Create Submit button
    $submit = document.createElement('button');
    $submit.addEventListener('click', onAnswerSubmit);
    $submit.innerHTML = 'Submit';
    // Add the submit button
    $dom.display.appendChild($submit);
  }
  
  function onAnswerSubmit() {
    // Get the checked radio button
    var selectedChoice = $dom.display.querySelector('input:checked');
    if (!selectedChoice) {
      alert("You need to select an answer");
    } else {
      // If it's correct
      if (quiz.questions[num].choices[selectedChoice.value].correct) {
        score++; // Add 1 point to the score
      }
      num++;
      nextScreen();
    }
  }
  
  function displayEndResult() {
    clearDisplayArea();
    $dom.display.innerHTML = '<p>End of Quiz</p>'
                    + '<p>Congratulations! Your score is: ' + score + '</p>'
                    + '<p>If you scored lower than 2, please keep practicing</p>';
  }
  
  function clearDisplayArea() {
    $dom.display.innerHTML = '';
  }

  // The "DOM" (Document Object Model) represents HTML elements
  function initDOM(quiz, $container) {
    // Create frame

Answer 1

这是一个解决方案，首先确保您的 html 文件中有一个输入框。
现在，您可以使用输入框给它 class 任何您想要的内容，如下所示

<input class="personAnswer"></input>

现在您可以返回您的 JS 代码并添加以下内容

document.getElementById("personAnswer").(WHATEVER YOU WANT TO CHECK FOR)

就是这样！

如何使用文本框形式添加开放式问题 Javascript

How to add open questions with textbox form Javascript

html

javascript

textbox