Question

我有一个模式框，单击按钮时会打开，当模式可见时，如果单击内容框外部的区域，则模式应消失。

我遇到的问题是我的模态一直在创建模态，并且没有被完全删除，从而造成了内存泄漏。

类show-login-modal处理模态的可见性。

let x = 1;

function LoginPopup(){

    let modal = document.getElementById('modal');

    modal.classList.add('show-login-modal');

    let xx = x++;

    function _removeModal() {
        modal.classList.remove('show-login-modal');
        modal.removeEventListener("click", this);
    }

    modal.addEventListener('click', function(event) {
        console.log(xx);
        if (event.target === modal) {
            _removeModal();
         } 
     });
}

我包括了console.log以供参考。

解决此问题的最佳方法是什么？

Answer 1

removeEventListener的使用不正确，需要使用命名函数来调用它。因此，根据您的情况，您希望将事件目标检测移至_removeModal

内

function _removeModal(event){ if (event.target === this){ ... modal.removeEventListener('click', _removeModal)} }

modal.addEventListener('click', _removeModal)

使用addeventlistener（）发生内存泄漏

1 个答案: