Question

我已经开始使用电子js来开发桌面应用程序。

我想知道如何使用javascript函数绑定按钮点击事件，以便我可以执行其他操作。

我使用下面的HTML代码：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Manav Finance</title>
  </head>
  <body>
    <input type="button" onclick="getData()" value="Get Data" />
  </body>

  <script>
    // You can also require other files to run in this process
    require('./renderer.js')
  </script>
</html>

我的renderer.js代码如下所示：

function getData(){
        console.log('Called!!!');
    }

但我收到的错误是：

未捕获的ReferenceError：未定义getData 在HTMLInputElement.onclick

我做错了吗？

更新

更新了HTML文档并删除了require（）方法及其现在的工作：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Manav Finance</title>
    <script src="renderer.js"></script>
  </head>
  <body>
    <input type="button" id="btnEd" value="Get Data" onclick="getData()" />
  </body>
</html>

Answer 1

为将来的用户解释这个。 HTML文档中的<script>标记在全局范围内执行，这意味着this === window，即I.e。脚本中声明的任何函数或变量本身都变为全局。

当你require一个脚本时，它会在它自己的上下文中被隔离（它被包装在另一个函数中，所以this !== window，即脚本中声明的任何函数或变量在全局都不可用。

执行此操作的正确方法是使用require('./renderer.js')并使用此代码

function getData() {
    ...
}

document.querySelector('#btnEd').addEventListener('click', () => {
    getData()
})

在电子js中按钮单击事件绑定

1 个答案: