Question

我目前正在标题中看到该错误，并且我已尝试通过在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>

Answer 1

当您使用gradle时，您的变量将被限制在声明该变量的函数范围内。这意味着您无法在build.gradle回调函数之外访问const。

相反，一种可能的解决方案是使bloodType成为全局变量，然后像下面这样在window.onload回调中设置其值：

bloodType

这样，您可以通过所有功能访问onload，而只需查询一次DOM。

Answer 2

在onLoad外部将bloodType声明为var或let，以使其可在另一方法内访问，或从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);
}

Answer 3

就像其他人提到的那样，您需要使用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

更多信息：Do DOM tree elements with ids become global variables?

getElementByID不断返回未定义

3 个答案: