document.removeEventListener javascript

Question

如何刪除這種類型的監聽器？

document.addEventListener("onSomething", function(){
  //Do something
});

當嘗試刪除返回數字參數異常時，在第二個參數中設置一個函數，但我沒有一個函數。

 document.removeEventListener("customUploadComplete")

Answer 1

您需要引用該函數才能將其刪除。 因此，將其拉入功能中即可將其刪除。

var thisThing = function(){
  //Do something
}

document.addEventListener("onSomething", thisThing);
document.removeEventListener("onSomething", thisThing);

Answer 2

您需要聲明一個函數才能刪除它。 這是因為您需要在刪除時引用它，以便瀏覽器可以識別要刪除的事件。

這將不起作用：

btn.addEventListener("click", function() { alert("clicked") });
btn.removeEventListener("click", function() { alert("clicked") });

因為沒有引用該功能。 每個函數都是唯一的，即使它們內部具有相同的代碼也是如此。

如果聲明一個函數，則可以存儲對該函數的引用，然后將其刪除：

function clickEvent() {
  alert("clicked!");
}
btn.addEventListener("click", clickEvent);
btn.removeEventListener("click", clickEvent);

這是一個例子：

 let $ = document.querySelector.bind(document), btn = $("#b1"), add = $("#b2"), remove = $("#b3"); function clickEvent() { alert("click"); } btn.addEventListener("click", clickEvent); remove.addEventListener("click", function() { btn.removeEventListener("click", clickEvent); alert("event removed!"); }); add.addEventListener("click", function() { btn.addEventListener("click", clickEvent); alert("event added!"); }); 

 <button id="b1">click me</button> <p/> <button id="b2">Add Event Listener</button> <button id="b3">Remove Event Listener</button>