getElementByID продолжает возвращать неопределенный - PullRequest
Новая
       5

getElementByID продолжает возвращать неопределенный

0 голосов
/ 24 февраля 2019

В настоящее время я получаю сообщение об ошибке, показанное в заголовке, и я пытался исправить проблему с помощью многочисленных решений, найденных в stackoverflow, но пока ни одно из них не работало, любые предложения / помощь будут оценены. 

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title> Donor Request </title>
  </head>
  <body>
    <form>
      <div>
        <label> Blood Type </label>
        <input type="text" name="" id="bloodType" value="">
        <label> Location </label>
        <input type="text" name="" id="Location" value="">
      </div>
      <button type="submit" name="button"> Request </button>
    </form>
  </body>
  <script type="text/javascript">

      const { ipcRenderer } = require('electron').remote;

      const form = document.querySelector('form')

      form.addEventListener('submit', submitForm);

      window.onload = function(){
        const bloodType = document.getElementById("bloodType").value;
      }

      function submitForm(e){
        e.preventDefault();
        console.log("working");
        console.log(bloodType, "working");
        ipcRenderer.send('Request:bloodType', bloodType);
    }

  </script>
</html>

Ответы [ 3 ]

0 голосов
/ 24 февраля 2019

Когда вы используете const, ваша переменная будет ограничена областью действия функции, в которой она была объявлена.Это означает, что вы не можете получить доступ к bloodType вне вашей функции обратного вызова window.onload.

Вместо этого одним из возможных решений может быть сделать bloodType глобальной переменной, а затем установить ее значение в вашем обратном вызове onloadвот так: 

let bloodType;
window.onload = function(){
  bloodType = document.getElementById("bloodType").value;
}

Таким образом, вы можете получить доступ к bloodType через все ваши функции, при этом нужно всего лишь один раз запросить DOM.

0 голосов
/ 24 февраля 2019

Как уже упоминалось, вам нужно определить bloodType вне функции window.onload, используя let или внутри функции submitForm.

function submitForm(e) {
  let bloodType = document.getElementById("bloodType").value;

  e.preventDefault();
  console.log("working");

  console.log(bloodType, "working");
  ipcRenderer.send('Request:bloodType', bloodType);
}

Интересно то, что переменная bloodType, которую вы используете в submitForm, не будет выдавать ошибку ссылки.Потому что bloodType относится к фактическому элементу ввода с id=bloodType.

Если у вас есть элемент 

<div id="example">some text</div>

example.innerHTML возвращает some text без необходимости создавать let example = document.getElementById("example") переменную вручную

Итак,если вы сделаете bloodType.value с вашим существующим кодом, он будет работать.Но вы должны использовать document.getElementById("bloodType").value

Дополнительная информация: Становятся ли элементы дерева DOM с идентификаторами глобальными переменными?

0 голосов
/ 24 февраля 2019

Объявите bloodType как var или let вне onLoad, чтобы сделать его доступным внутри другого метода, или получите его изнутри submitForm. 

function submitForm(e){
    const bloodType = document.getElementById("bloodType").value;
    e.preventDefault();
    console.log("working");
    console.log(bloodType, "working");
    ipcRenderer.send('Request:bloodType', bloodType);
}

let bloodType;

window.onload = function(){
    bloodType = document.getElementById("bloodType").value;
}

function submitForm(e){
    e.preventDefault();
    console.log("working");
    console.log(bloodType, "working");
    ipcRenderer.send('Request:bloodType', bloodType);
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...