即使未單擊按鈕，也會觸發按鈕上的 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是一個指向函數的指針，它將在點擊事件被觸發時進行評估。