приложение викторины - JQuery проблема с кнопкой отправки в форме

Question

function submitAnswer() {
$('.textBox').on("click",".submitButton",function (event) {    

    event.preventDefault();    
    $('.js-responseBox').show();   
    let selected = $('input:checked');    
    let answer = selected.val();   
    let correct = `${store[questionNumber].correctAnswer}`;    
    if (answer === correct)    
    {    
      $('.js-responseBox').html(    
      `<h3>Your answer is correct!</h3>   
      <p>Good Job</p>    
      <button type="button" class="nextButton button">Next</button>`    
      );    
      updateScore();    
    }     
    else    
    {   
      $('.js-responseBox').html(    
      `<h3>That's a wrong answer</h3>   
      <p>Correct Answer is:</p>   
      <p>${store[questionNumber].correctAnswer}</p>
      <button type="button" class="nextButton button">Next</button>`
      );
    }

   });
  }

     function generateOptions(questionNumber) {      
     return `<section class="textBox">    
         <legend>${store[questionNumber].question}</legend><br />
          <fieldset>
             <form id="myForm">
             <br />  
             <label>     
                <input class="answer" type="radio" name="option" ></input>    
                <span>${store[questionNumber].answers[0]}</span>       
             </label>       
             <br />    
             <label>    
            <input class="answer" type="radio" name="option"></input>    
            <span>${store[questionNumber].answers[1]}</span>    
          </label>    
          <br />    
          <label>    
            <input class="answer" type="radio" name="option"></input>    
            <span>${store[questionNumber].answers[2]}</span>    
          </label>    
          <br />    
          <label>   
            <input class="answer" type="radio" name="option"></input>    
            <span>${store[questionNumber].answers[3]}</span>   
          </label>    
          <br />   

Я пробовал много разных способов

кнопка отправки в форме не работает должным образом при нажатии, она возвращает вас на предыдущую страницу, как будто ничего не происходит

Answer 1

Возможно, поскольку объект textBox создается динамически, обработчик событий для этого элемента подключен неправильно.

Попробуйте изменить селектор на то, что будет присутствовать на странице, когда обработчик событияприсоединено.

$(document).on(".textBox click",".submitButton",function (event) { //function contents });

Вот ссылка на дополнительную информацию по этому вопросу: https://api.jquery.com/on/#direct-and-delegated-events

См. раздел «Делегированные обработчики событий».