即使未单击按钮，也会触发按钮上的 onClick 事件

Question

我正在尝试向按钮添加事件侦听器，这是我使用的代码：

window.onload = function(){
    document.getElementById('loginButton').onClick = logInToPod();
}

问题是，由于某种原因，在页面加载时无需单击按钮， logInToPod()函数就会被调用，而我编写的代码应该只添加事件侦听器，而不是在单击按钮之前调用该函数，对吗？

我正在使用 webpack，我不知道这是否重要或是否导致了这种情况。

Answer 1

我看到两个主要问题：

所以我建议修改你的代码，如：

window.onload = function(){
    document.getElementById('loginButton').onclick = logInToPod;
}

这是一个 JSFiddle 示例。

Answer 2

出现这个问题是因为您使用括号直接调用 logInToPod 函数，这意味着它将在执行window.load的同一时间进行评估。 你应该通过一个指针来调用它，正如我在下面列出的

 window.onload = function(){ document.getElementById('loginButton').onclick = logInToPod; } function logInToPod() { alert("You have clicked me!"); }

 <button id="loginButton">Click me to alert</button>

这里的logIntoPod是一个指向函数的指针，它将在点击事件被触发时进行评估。