為什么我的JavaScript函數看到mouseevent而不是空變量？

Question

我將事件監聽器附加到頁面上的按鈕。 單擊后，它將運行一個功能。

harvestDataBtn.addEventListener("click", harvestData, false);

該函數可以選擇一個值。

function harvestData(idsToHarvest)

我不希望單擊按鈕將任何東西傳遞給該函數。 可選變量idsToHarvest在調用函數的其他實例中使用，與單擊分開。

但是，當我單擊該按鈕時， idsToHarvest是鼠標idsToHarvest 。 在我的函數內部制作以下代碼無法正常工作。

if ( idsToHarvest ) {
  // do something with string
} else {
  // button was clicked, do something else
}

Answer 1

您可以向事件偵聽器傳遞一個函數，該函數包裝對期望的harvestData調用，並忽略默認情況下傳遞的事件對象：

harvestDataBtn.addEventListener("click", function (e){harvestData();}, false);

Answer 2

el.addEventListener("click", function (event){ ... });

第二個參數（在這種情況下為函數）期望傳入的參數是事件對象。

如果您將同一函數用於其他目的，並且期望參數是其他參數，則它將無法用作事件處理程序。

根據規范 ，它指出：

事件偵聽器包含以下字段：

• 類型 （字符串）
• 回調 （一個EventListener ）
• 捕獲 （布爾值，最初為false）
• 被動的 （布爾值，最初為false）
• 一次 （布爾值，最初為false）
• 移除 （用於簿記目的的布爾值，最初為false）

如前所述，它表明callback實際上是一個EventListener ，它由所示接口定義：

callback interface EventListener {
    void handleEvent(Event event);
};

正如你所看到的，回調時可將計算handleEvent被調用，它接受1個參數，類型的事件 Event 。