原生JS元素怎么取消事件

最新推荐文章于 2022-04-15 17:41:32 发布

weixin_33928467

最新推荐文章于 2022-04-15 17:41:32 发布

阅读量1.3k

点赞数

原文链接：https://yq.aliyun.com/articles/606346

版权

关于原生JS元素怎么取消事件，有3种方式

方法1：removeEventListener

案例：

<body>

<div id="myDIV"> div 元素添加了 onmousemove 事件句柄，在你移动鼠标时会显示随机数。

<p>点击按钮移除 DIV 的事件句柄。</p>

</div>

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

function myFunction()

{

document.getElementById("demo").innerHTML = Math.random();

}

function removeHandler()

{

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

}

</script>

</body>

原生JS里面的方法很少，所以换一种思路，在方法里面进行判断

方法2：通过function里面的判断状态，然后return false

案例：

var state=1;

document.getElementById("myBtn").addEventListener("click", function(){

if(state==0){

return false

}else{

alert(“caca”);

state=0;

}
});

方法3：通过function的判断状态，然后在方法里面再次添加此事件，覆盖事件后，然后再return false

案例：