Приведение HTML в JS для трансляции изображения

Question

Я делаю викторину для чего-то. В HTML есть текстовое поле, в котором пользователь может ввести свой ответ. Я хочу отправить его в JS для трансляции изображения («правильное» изображение, если оно правильно, «неправильное» изображение, если оно неверно). Это код, относящийся к этой проблеме.

Html

<input class="respBox" id="ans1" placeholder="Insert value of X here"> 
<p id="response1"></p> 


<button type="button" class="specialButton" onclick="checkAnswers()">Submit</button> 

JS функция checkAnswers() {

if (ans1 === "7.5") {// If x is 7.5 
    response1 = rightAns;//rightAns is image for right answer 
    document.getElementById('response1').innerHTML = response1;//updates scoring system 
    score++;//adds one point to the user's score 
} else { 
    response1 = wrongAns;//wrongAns is image for wrong answer 
    document.getElementById('response1').innerHTML = response1;//updates scoring system 

    }} 

Я получаю сообщение об ошибке, когда я вижу на сайте.

Uncaught TypeError: Не удается прочитать свойство «значение» нуль в checkAnswers

Answer 1

<form action="javascript:checkAnwsers()"> 
    <input class="respBox" name="answer" placeholder="Insert value of X here"> 
    <p id="response1"></p> 

    <input type="submit" value="submit"> 
</form> 

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

Используйте это для доступа к данным в JavaScript:

var formElements = document.forms['myform'].elements['inputTypeName'].value;