javascript - 事件发生后删除 JavaScript 中的 EventListener？

Question

有 24 个 div 对象等待/监听鼠标单击。单击一个 div 对象后，我想删除 EventListener来自所有 24 个 div 对象。

for (var i=1;i<=24;i++){
    document.getElementById('div'+i).addEventListener('click',function(event){
        for (var z=1;z<=24;z++){
            document.getElementById('div'+z).removeEventListener()//Problem lies here
        }

        //Some other code to be run after mouseclick

        },false);

}

问题是 removeEventListener嵌套在 addEventListener我需要将类型、监听器、标题定义为 removeEventListener 的属性方法。而且我认为由于嵌套而无法定义监听器。

我也尝试定义一个函数名，但没有奏效:

for (var i=1;i<=24;i++){
    document.getElementById('div'+i).addEventListener('click',function helpme(event){
        for (var z=1;z<=24;z++){
            document.getElementById('div'+z).removeEventListener('click',helpme,false);
        }

        //Some other code to be run after mouseclick

        },false);

}

Answer 1

您可以告诉事件监听器只触发一次:

document.addEventListener("click", (e) => {
            // function which to run on event
}, { once: true });

文档说:

once:
A boolean value indicating that the listener should be invoked at most once after being added. If true, the listener would be automatically removed when invoked.