建站学 - 轻松建站从此开始!

建站学-个人建站指南,网页制作,网站设计,网站制作教程

IE6/7/8下同类型事件的多个handler无序执行

时间:2011-04-09 13:53来源: 作者: 点击:
大家应该注意的问题,在IE6/7/8下同类型事件的多个handler执行是无序的。 我们的演示程序如下, 01 <div id="d1" style="width:200px;height:200px;background:gold;"></div>  02 <script type="text/javascript">&n

大家应该注意的问题,在IE6/7/8下同类型事件的多个handler执行是无序的。
我们的演示程序如下,

01 <div id="d1" style="width:200px;height:200px;background:gold;"></div> 

02 <script type="text/javascript"> 

03     function addEvent(el, type, fn){ 

04         if(el.addEventListener){ 

05             el.addEventListener(type, fn, false); 

06         }else{ 

07             el.attachEvent('on' + type, fn); 

08         } 

09     } 

10     var el = document.getElementById('d1'); 

11     function handler1(){ 

12         alert('test1'); 

13     } 

14     function handler2(){ 

15         alert('test2'); 

16     } 

17     function handler3(){ 

18         alert('test3'); 

19     } 

20     function handler4(){ 

21         alert('test4'); 

22     } 

23     function handler5(){ 

24         alert('test5'); 

25     } 

26     addEvent(el, 'click', handler1); 

27     addEvent(el, 'click', handler2); 

28     addEvent(el, 'click', handler3); 

29     addEvent(el, 'click', handler4); 

30     addEvent(el, 'click', handler5); 

31 </script>


以上,给div[id=d1]的click事件添加了5个handler。
程序运行后出现黄色方框,点击一下黄色区域试试看。

IE6/7/8 :无序(可多点几次试试)

IE9/Firefox/Safari/Chrome/Opera :test1 -> test2 -> test3 -> test4 -> test5 顺序

(责任编辑:admin)
织梦二维码生成器
顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
用户名: 验证码:点击我更换图片