Question

这是我的代码

    const keyUpEvent = (e, someString) => {
        if(e.keyCode === 13){
            console.log(someString);
        }
    }

    const openTaskPopUp = (e) => {
        const someString = "abc";
        const someFunction = (event) => {
            keyUpEvent(event,someString);
        }
        someButton.removeEventListener('keyup' , someFunction);
        someButton.addEventListener('keyup' , someFunction);        
        //code
    }

两个someFunction是否不同？因为removeEventListener根本不起作用。 console.log(someString);首先打印someString一次，然后两次，然后三次，等等。

Answer 1

问题不是该函数是否被命名为，而是问题是您要删除的函数实际上是否作为该事件的元素上的处理程序存在。您仍然每次都在创建函数，因此一次调用someFunction所创建的openTaskPopUp与下一次调用所创建的someFunction是不同的函数-因此不会被删除

您需要记住分配给您的功能才能将其删除。例如：

const keyUpEvent = (e, someString) => {
    if(e.keyCode === 13){
        console.log(someString);
    }
};

let openTaskPopUpKeyupHandler = null;                                    // ***
const openTaskPopUp = (e) => {
    const someString = "abc";
    someButton.removeEventListener('keyup' , openTaskPopUpKeyupHandler); // ***
    openTaskPopUpKeyupHandler = (event) => {                             // ***
        keyUpEvent(event,someString);
    }
    someButton.addEventListener('keyup' , openTaskPopUpKeyupHandler);    // ***    
    //code
};

即使使用命名函数，removeListener也无法正常工作

1 个答案: