IE FireFox 兼容之 window.event

Html代码  收藏代码
  1. <HTML>  
  2. <HEAD>  
  3. <TITLE> New Document </TITLE>  
  4. <script type="text/javascript">  
  5. function testEvent(){  
  6.   var target = window.event.srcElement ;  
  7.   document.getElementById('result').innerHTML = target.tagName;  
  8. }  
  9. </script>  
  10. </HEAD>  
  11. <BODY>  
  12. <div id="result"></div>  
  13. <input type="button" value="点我" onclick="javascript:testEvent()"/>  
  14. </BODY>  
  15. </HTML>  

 这段代码在IE浏览器下的效果是,点击按钮,页面上显示“input”。但是在FireFox下点击按钮则会报错:window.event is undefined。这是因为在FireFox下window.event只能在事件发生的现场使用,也就是说,event变量必须在方法调用处被传入。再看下面的代码。

 

Html代码  收藏代码
  1. <HTML>  
  2. <HEAD>  
  3. <TITLE> New Document </TITLE>  
  4. <script type="text/javascript">  
  5. function testEvent(number,ev){  
  6.   var target = ev.srcElement || ev.target;  
  7.   document.getElementById('result').innerHTML = target.tagName+ number;  
  8. }  
  9. </script>  
  10. </HEAD>  
  11.   
  12. <BODY>  
  13. <div id="result"></div>  
  14. <input type="button" value="点我" onclick="javascript:testEvent(20,event)"/>  
  15. <script type="text/javascript">  
  16. //testEvent();  
  17. </script>  
  18. </BODY>  
  19. </HTML>  

 

上面的代码在IE和FireFox下执行都能生效,且效果相同。上面的代码有几处需要注意:

1、传入调用方法的event变量一定要是“event”,其它字符不能代替。但是位置不限。

2、event变量的点击对象获取在IE和firefox下也是不同的。IE下使用 .target获取,FireFoxe则要使用.srcElement获取。

 

其它兼容性问题

 

1、IE中 event对象有x,y属性,没有pageX,pageY属性;FireFox中有pageX,pageY属性,没有x,y属性。

2、待续。。。。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值