Question

这是一个愚蠢的问题，因为我不知道框架是什么。因此，只需忽略此要求即可。（仅供参考，我无法再删除此帖子）

Answer 1

从您在JavaScript中导入HTML的事实来看，我认为您正在使用WebPack

WebPack会将每个模块包装在它们自己的名称空间中，这样就无法全局访问它们。换句话说，myFunction仅在您位于JS文件中时被定义为。除此之外，该功能不存在（因此无法通过HTML访问）

“导出” myFunction的最简单方法是将其存储在全局对象上：

window.myFunction = myFunction;

但是，这不是一个好习惯，因为您正在污染全局名称空间，并假设window对象将可用（在浏览器中）是的，但是您的代码将不再在Node中工作）

一个更好的选择是像这样使用addEventListener：

document.getElementsByTagName("button")[0].addEventListener("click", myFunction);

然后，您可以在HTML中删除onclick属性

Answer 2

首先，我认为您不想将html文件导入到javascript中。

第二，看起来您想将值分配给数组，我将改用对象。这样，您可以直接将值直接分配给对象。

User = {
   name: x,
   age: y
}

user.age = $（'＃ageInput'）。val（）; user.name = $（'＃nameInput'）。val（）;

然后您可以创建一个User对象数组。

[用户，用户，用户]-不太确定这是否是您要使用的，但是总的来说，我会说这比将名称和年龄的值放入没有键的数组中更好。 / p>

请注意，如果您想使用jQuery这样引用它们，则输入中也需要ID。

总体看起来像--

<head>
  <title>title</title>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
  <script src="main.js"></script>
</head>
<body>
  <input type="text" name='nameInput' id='nameInput'><div>Name</div>
  <br>
  <input type="text" name='ageInput' id='ageInput'><div>Age</div>
  <br>
  <button type="button" onclick='myFunction()'>Add User</button>
</body>

var users = [];

function myFunction() {

    let user = {
          name: $('#nameInput').val(),
          age: $('#ageInput').val()
    };

    users.push(user);
};

未定义ReferenceError myfunction

2 个答案: