Javascript 如何删除一个"；“鼠标”；Java脚本中的事件侦听器

在这里，我拖动一个元素并将其放置在另一个位置。如果我不使用事件侦听器，它可以正常工作，但如果我以这种格式使用它，它就不会执行“放置”操作

此链接包含我的代码“带有事件侦听器” 拜访

此链接包含我的代码“无事件侦听器” 拜访

---

问题是在添加和删除

mousemove

事件时使用了不同的函数。 虽然它们具有相同的功能，但它们在内存中的功能不同，因此处理方式也不同

看看固定版本：

removeEventListener（）

必须具有与

addEventListener（）

中使用的相同的事件名称+函数才能删除正确的事件。该函数不能是匿名函数，因为它创建了一个新函数（尽管看起来可能相同）。您需要使用引用（如指针），它可以是命名函数或变量

注意：另外，当将函数传递给这些方法时，如果原始函数希望获得与匿名函数相同的参数，则不必包装在匿名函数中。我是说，这个：

 document.getElementById("div1").addEventListener("mousemove",function() {
    myFunction(event);
});

可以这样编写，因为

myFunction（）

需要一个

事件

参数，该参数无论如何都会提供，从而为您保存一个函数包装器：

document.getElementById("div1").addEventListener("mousemove",  myFunction);

---

您必须附加一个带有函数引用的事件，然后可以使用相同的引用删除侦听器。无法使用删除匿名事件处理程序

附上参考资料：

document.getElementById("div1").addEventListener("mousemove", myFunction);

document.getElementById("div1").removeEventListener("mousemove", myFunction);

删除并引用：

document.getElementById("div1").addEventListener("mousemove", myFunction);

document.getElementById("div1").removeEventListener("mousemove", myFunction);

---

注意，

e

自动传递给处理程序，您不需要手动传递。

不要使用嵌入式事件函数。具有命名的事件函数。例如：

document.getElementById("div1").addEventListener("mouseup", myFunction);

myFunction(event){
if(t==1){
        x1 = e.clientX;
        y1 = e.clientY;
        var el=document.getElementById('div2');
        l=el.offsetLeft;
        r=el.offsetTop;
        t=10;
    }
        x = e.clientX;
        y = e.clientY;
    placeobj(x,y,x1,y1,l,r);
}

现在，您可以轻松删除以下事件：

document.getElementById("div1").removeEventListener("mouseup", myFunction);

---

另外，我建议改用jQuery:）

@JVT如果您认为这个答案有帮助，您也可以投票支持它