如果回调函数具有.bind,则removeEventListener失败

问题描述

以下代码不会删除事件监听器...而且我不明白为什么。有人可以填写我吗?我猜想这与将this绑定到回调有关(即使this应该始终指的是同一件事)。

class myClass {

    private htmlElement: HTMLElement; 
    
    constructor() {
        const htmlElement: HTMLElement | null = document.getElementById("whatever");
        if (htmlElement === null) {
            this.htmlElement = document.createElement("div");
            return;
        } else {
            this.htmlElement = htmlElement;
            this.firstFunc()
        }
    }

    firstFunc() {
        setTimeout(this.secondFunc.bind(this),1000);
    }

    secondFunc() {
        this.htmlElement.addEventListener("transitionend",this.thirdFunc.bind(this));
        this.htmlElement.addEventListener("moztransitionend",this.thirdFunc.bind(this));
        this.htmlElement.addEventListener("webkittransitionend",this.thirdFunc.bind(this));
    }

    thirdFunc() {
        this.htmlElement.removeEventListener("transitionend",this.thirdFunc.bind(this));
        this.htmlElement.removeEventListener("moztransitionend",this.thirdFunc.bind(this));
        this.htmlElement.removeEventListener("webkittransitionend",this.thirdFunc.bind(this));
        setTimeout(this.secondFunc.bind(this),1000);
    }
}

如果JS提供getAllEventListeners(): EventListener[]这样的东西,那肯定会很好。。。将确实简化这种事情。

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)