当某个函数运行时删除一个 EventListener

Question

我有以下代码：function setEvents() {  // do some code  myValidation();}function myValidation() { // do some checks // if checks passed, then set the values to URL parameters window.location.replace(window.location.href + "?myName=" + capture_name);}setEvents();$( "#edit-submitted-name-consolidation" ).click(function() {   window.addEventListener("beforeunload", function(e){     (e || window.event).returnValue = setEvents();              }, false);});解释：我上面的代码setEvent()调用了myValidation()从内部调用函数的函数。另外，我有一个代码，beforeunload可以在用户关闭浏览器时运行相同的功能。这仅在单击某个输入时发生。但是，我希望myValidation()不要运行此beforeunload.所以换句话说，我希望浏览器总是运行beforeunload，但是当myValidation()被调用/使用时，beforeunload应该被删除。所以为了实现这一点，这就是我尝试过的：function setEvents() {  // do some code  myValidation();}function myValidation() { // do some checks // if checks passed, then set the values to URL parameters window.removeEventListener("beforeunload",(e)); window.location.replace(window.location.href + "?myName=" + capture_name);}setEvents();$( "#edit-submitted-name-consolidation" ).click(function() {   window.addEventListener("beforeunload", function(e){     (e || window.event).returnValue = setEvents();              }, false);});所以，我添加window.removeEventListener("beforeunload",(e));了myValidation(). 但是，这对我不起作用。所以我可以问，beforeunload如果myValidation()正在使用，我如何删除？

Answer 1

问题是你应该将处理程序提取到一个变量中，因为这是两个独立的函数，你必须有一个对原始函数的引用，你不能像这样删除监听器。

您现在正在做的是删除不存在的事件侦听器。

const handler = function(e){

  (e || window.event).returnValue = setEvents();           

}

window.addEventListener("beforeunload", handler, false);

window.removeEventListener("beforeunload", handler);

进一步解释：试试这个=>

const x = () => {}

const y = () => {}

console.log(x === y) // should be true right? wrong. functions are compared by reference.

console.log(x === x) // this is true, since the reference is the same