js 中 removeEventListener() 方法不生效情况解决办法

介绍

addEventListener()与removeEventListener()用于处理指定和删除事件处理程序操作。所有的DOM节点中都包含这两种方法，并且它们都接受3个参数：要处理的时间名、作为事件处理程序的函数和一个布尔值。最后这个布尔值参数是true，表示在捕获阶段调用事件处理程序；如果是false，表示在冒泡阶段调用事件处理程序。

document.addEventListener("mousedown", function(e){
    console.log("鼠标按下了");

    document.addEventListener("mousemove", function(e){
        console.log("鼠标在移动");
    });

    document.addEventListener("mouseup", function(e){
        console.log("鼠标抬起了");

        document.removeEventListener("mousemove",function(e){})
    })
});

正常来说的话，当鼠标按下后，控制台输出鼠标按下了，此时挪动鼠标，
控制台会持续输出鼠标在移动， 然后松开鼠标，此时控制台输出。
鼠标抬起了，这时再挪动鼠标，控制台讲道理不会再输出鼠标在移动，
因为我们已经使用 removeEventListener 移出移动时的事件监听了，然而它不讲道理。 


因为移除事件监听时传入的参数要与添加事件监听时使用的参数相同

解决办法：先把监听后执行的方法封装成一个函数，这样直接在 eventListener 里写函数名称即可保证参数相同。 代码如下：

document.addEventListener("mousedown", function(e){
    console.log("鼠标按下了");

    document.addEventListener("mousemove", mouseMove);

    document.addEventListener("mouseup", function(e){
        console.log("鼠标抬起了");

        document.removeEventListener("mousemove", mouseMove)
    })
});

function mouseMove(){
    console.log("鼠标在移动");
}