js删除事件(解绑事件)

m0_63400611

已于 2022-05-18 15:58:58 修改

阅读量1.5k

点赞数

分类专栏： js 文章标签： javascript html 前端

于 2021-12-08 14:37:38 首次发布

本文链接：https://blog.csdn.net/m0_63400611/article/details/121790758

版权

js 专栏收录该内容

55 篇文章 2 订阅

订阅专栏

1.传统注册方式

eventTarget.onclick = null

2.方法监听注册方式

eventTarget.removeEventListener(type, listener[, useCapture]);

<html>
<head>
<meta charset="utf-8">
<title>333333</title>
	<style>
		div {
			width: 100px;
			height: 100px;
			background-color: pink;
		}
	</style>
</head>

<body>
	
	<div>1</div>
	<div>2</div>
	<div>3</div>
	
	<script>
		
		var divs = document.querySelectorAll('div');
		divs[0].onclick = function() {
			alert(11);
//			传统方式删除事件
			divs[0].onclick = null;
		}
		
		divs[1].addEventListener('click', fn); //里面的fn不需要加()调用
		function fn() {
			alert(22);
			divs[1].removeEventListener('click', fn);
		}
		
		//IE8以下浏览器
		divs[2].attachEvent('onclick', fn1);
		function fn1() {
			alert(33);
			divs[2].detachEvent('onclick', fn1);
		}
		
		//删除时间兼容性解决方案
		function removeEventListener(element, eventName, fn) {
			//判断当前浏览器是否支持 removeEventListener方法
			if(element.removeEventListener) {
				element.removeEventListener(eventName, fn);
			}else if(element.detachEvent) {
				element.detachEvent('on' + eventName, fn);
			}else {
				element['on' + eventName] = null;
			}
		}
		
	</script>
	
</body>
</html>

m0_63400611

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
js删除事件(解绑事件)

1.传统注册方式eventTarget.onclick = null2.方法监听注册方式eventTarget.removeEventListener(type, listener[, useCapture]);<html><head><meta charset="utf-8"><title>333333</title> <style> div { width: 100px; height: 1
复制链接

扫一扫

专栏目录