如何在 JavaScript 中將參數傳遞給事件監聽器函數？

事件監聽器：向監聽器函數傳遞參數

使用addEventListener 方法附加事件監聽器時，可能存在需要傳遞參數的情況監聽器函數的參數。其中一個場景涉及檢索在偵聽器範圍之外定義的變數的值。

場景和問題

考慮以下程式碼：

var someVar = some_other_function();
someObj.addEventListener("click", function(){
    some_function(someVar);
}, false);

這裡，someVar是在監聽器函數外部定義的變數，我們的目標是當發生「點擊」事件。但是，在偵聽器函數中，someVar 被視為新變量，導致無法存取其預期值的問題。

建議的解決方案：利用事件目標的屬性

不要明確傳遞參數，而是考慮存取事件目標的屬性來檢索必要的資訊。在上面的範例中，您可以將自訂屬性myParam 附加到someObj，如下所示：

const someInput = document.querySelector('button');
someInput.addEventListener('click', myFunc, false);
someInput.myParam = 'This is my parameter';

function myFunc(evt)
{
  window.alert(evt.currentTarget.myParam);
}

現在，在偵聽器函數myFunc 中，您可以透過引用evt.currentTarget.myParam 來訪問參數值。此方法無需明確傳遞參數並確保獲得正確的值。

以上是如何在 JavaScript 中將參數傳遞給事件監聽器函數？的詳細內容。更多資訊請關注PHP中文網其他相關文章！