為什麼我的事件監聽器立即觸發函數？

事件監聽器：無提示函數呼叫之謎

使用事件監聽器時，可能會遇到一種令人費解的行為：新增帶有外部函數引用的事件監聽器似乎即使不單擊該元素，也可以立即呼叫函數。這可能會令人沮喪並導致意外行為。

請考慮以下HTML 片段：

<span>

要加入點擊事件，可以使用addEventListener 方法：

first.addEventListener('click', function() {
  alert('sup!');
})

此程式碼按預期工作，在按一下「第一個連結」時觸發警報。但是，當使用外部函數作為第二個參數時：

function message_me(m_text) {
    alert(m_text)
}

second.addEventListener('click', message_me('shazam'))

立即呼叫 message_me 函數，甚至在點擊「第二個連結」之前就會產生警報訊息。

至要解決此問題，需要了解 addEventListener 的第二個參數需要一個函數參考。在有問題的程式碼中，直接呼叫函數並將其結果傳遞給 addEventListener。相反，應該使用匿名函數作為第二個參數，或者應該修改外部函數以返回函數。

例如，我們可以在addEventListener 中使用匿名函數：

function message_me(m_text) {
    alert(m_text)
} 

second.addEventListener('click', 
    function() {
        message_me('shazam');
    }
);

透過在匿名函數中提供函數引用，我們確保僅在單擊「第二個連結」時調用message_me函數。

以上是為什麼我的事件監聽器立即觸發函數？的詳細內容。更多資訊請關注PHP中文網其他相關文章！