为了账号安全,请及时绑定邮箱和手机立即绑定

求大家帮我找错误,跨浏览器事件处理只能实现IE,谷歌上没反应

<!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>
<input type="button" id="btn1" value="按钮1" onclick="showMessage()"/>
<input type="button" id="btn2" value="按钮2" />
<input type="button" id="btn3" value="按钮3" />
<input type="button" id="btn4" value="按钮4" />
<input type="button" id="btn5" value="按钮5" />
</div>
<script type="text/javascript">
function showMessage(){
	alert("第一种事件处理程序:HTML事件处理程序");
}

var btn2=document.getElementById('btn2');
btn2.onclick=function(){
	alert("第二种事件处理程序:DOM0级事件处理程序");
}
//btn2.onclick=null;//删除事件
function showMs(){
	alert("第三种事件处理程序:DOM2级事件处理程序");
}
var btn3=document.getElementById('btn3');
btn3.addEventListener('click',showMs,false);
btn3.addEventListener('click',function(){
	alert(this.value);
},false);
//btn3.removeEventListener('click',showMs,false);//删除事件
var btn4=document.getElementById('btn4');
function showMsg(){
	alert("第四种事件处理程序:IE事件处理程序");
}//对谷歌浏览器无效
btn4.attachEvent('onclick',showMsg);
btn4.detachEvent('onclick',showMsg);
//跨浏览器事件处理程序,用封装的方法


//按钮5的JavaScript代码如下:
var btn5=document.getElementById('btn5');
function show(){
	alert("第五种事件处理程序:跨浏览器事件处理程序");
}
var EventUtill={
	//添加句柄
	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;
		}
	}
	
}
EventUtill.addHandler(btn5,'click',show);
</script>
</body>
</html>

这是我的全部代码,出问题的代码在最后的部分,按钮5的事件实现不了。但是看不出错在哪里,IE上点击按钮5可以,chrome上不行,求查错!

正在回答

5 回答

因为chrome中

btn4.attachEvent('onclick',showMsg);

btn4.detachEvent('onclick',showMsg);

这两句报错了,所以JS不会往下执行,就没有办法给btn5添加事件

0 回复 有任何疑惑可以回复我~

http://img1.sycdn.imooc.com//581c2ae8000138a104490450.jpg调试结果如图

0 回复 有任何疑惑可以回复我~

上面讲有理由应该是对的。。attachEvent这个方法在谷歌里面不支持,可能就报错了,并不能继续往下执行,所以就看不到下面正确的语句效果了

1 回复 有任何疑惑可以回复我~
#1

连枝 提问者

谢谢!
2016-11-04 回复 有任何疑惑可以回复我~
#2

烟雨非飞 回复 连枝 提问者

不客气!~~
2016-11-04 回复 有任何疑惑可以回复我~

function showMsg(){

    alert("第四种事件处理程序:IE事件处理程序");

}//对谷歌浏览器无效

btn4.attachEvent('onclick',showMsg);

btn4.detachEvent('onclick',showMsg);

//跨浏览器事件处理程序,用封装的方法

去掉这些就好了,估计是有处理不了

 


2 回复 有任何疑惑可以回复我~
#1

连枝 提问者

谢谢!
2016-11-04 回复 有任何疑惑可以回复我~

581c22630001c16c05000276.jpg

581c22630001256205000542.jpg

<input type="button" value="btn5" id="btn5"/>
可以啊,chrome测过了,没问题啊,就用你的代码,只取最后一部分,注释掉没有用的代码,你把上面代码注释掉试一下。

0 回复 有任何疑惑可以回复我~
#1

连枝 提问者

试过了,注释掉其他代码确实可以,但是为什么会这样呢,我觉得其他代码和按钮5的代码并不矛盾啊,为什么放在一起按钮5的事件就不能触发了呢?
2016-11-04 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

求大家帮我找错误,跨浏览器事件处理只能实现IE,谷歌上没反应

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信