码迷,mamicode.com
首页 > 其他好文 > 详细

跨浏览器处理事件

时间:2015-07-12 17:35:53      阅读:119      评论:0      收藏:0      [点我收藏+]

标签:

<!DOCTYPE html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>

</head>
</body>
<div id="box">
	<input type="button" value="按钮1" id="bt" onclick="song()" />
    <input type="button" value="按钮2" id="bt2"  />
    <input type="button" value="按钮3" id="bt3"  />

解决各个浏览器不兼容的问题
<script>
	function song(){
		alert("Hello");
	}
	
	var bt2 = document.getElementById('bt2');
	var bt3 = document.getElementById('bt3');
	//bt2.onclick = song;
	//bt2.onclick = null;
	
	//dom2级事件
	//bt3.addEventListener('click',function(){alert(this.value);},false);
	//bt3.removeEventListener('click',song,false);
	//bt3.attachEvent('onclick',song);
	//bt3.detachEvent('onclick',song);
	
	
	//跨浏览器
	var kua={
		//添加句柄
		 addHandler:function(element,type,handler){
		 if(element.addEventListener){
			element.addEventListener(type,handler,false);
		}else if(element.attachEvent){
			element.attachEvent('on'+type,handler);
		}else{
			element['on'+type] = handler;
		  }
		},
		//删除句柄
		removeHandler:function(element,type,handler){
			if(element.removeEventListener){
				element.removeEventListener(type,handler,false);
			}else if(element.detachEvent){
				element.detachEvent('on'+type,handler);
			}else{
				element['on'+type] = null;
			}
		}
	}
	kua.addHandler(bt2,'click',song);
	kua.removeHandler(bt2,'click',song);
</script>
</div>

</body>
</html>

版权声明:本文为博主原创文章,未经博主允许不得转载。

跨浏览器处理事件

标签:

原文地址:http://blog.csdn.net/yzi_angel/article/details/46850435

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!