Блог

Главная - Вопросы по программированию - Почему мой HTML-код возвращает [объект HTMLFormElement]?

Почему мой HTML-код возвращает [объект HTMLFormElement]?

#javascript #html

Вопрос:

Я очень новичок в кодировании, поэтому приношу извинения за очевидный вопрос, но я пытаюсь создать код в HTML, который принимает значение, введенное пользователем, и печатает значение внизу в теге абзаца. Если это не имеет смысла, вот мой код до сих пор и изображение файла.

 <!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body>
    <form id="form">
      <input type="text" id="theInput" name="theInput">
    </form>
    <script type="text/javascript">
      function myFunction(){
        var input = document.forms["form"];
        document.getElementById("message").innerHTML = input
      }
    </script>
    <button onclick="myFunction()">
      Press me!
    </button>
    <p id="message"></p>
  </body>
</html>

снимок экрана с ошибкой

Спасибо!

Комментарии:

1. Потому forms что это ссылка <form> на ваш документ. Это не <input> элемент, и это не значение <input> элемента, которого вы хотите.

2. Я не видел document.forms (или какой-либо подобный аксессуар), используемый в течение очень долгого времени. Я бы рекомендовал использовать более современные JS, такие как querySelector etc (как показано в ответе ниже).

3. Примечание: JavaScript не является Java , несмотря на сходство в их названии.

Ответ №1:

Используйте приведенную ниже функцию, чтобы получить значение из текстового поля с помощью JS. Document.form это неправильный способ ввода текста.

   function myFunction(){
    var input = document.getElementById("theInput").value;
    document.getElementById("message").innerHTML = input
  }

Счастливого Кодирования!

Комментарии:

1. Кажется, это работает! Огромное спасибо

Метки: