用JavaScript事件串连执行多个处理过程的方法


Posted in Javascript onMarch 09, 2007

最近用到JavaScript 事件处理机制,找了些资料。
以前写 JavaScript 程序时,事件都是采用 

object.event = handler;

的方式初始化。这种方式对于 Internet Explorer、Mozilla/Firefox 和 Opera 来说很通用。但是有一个问题就是,这种方式只能一个事件对应一个事件处理过程。如果希望一个事件可以依次执行多个处理过程就不好用了。
但是 Internet Explorer 从 5.0 开始提供了一个 attachEvent 方法,使用这个方法,就可以给一个事件指派多个处理过程了。attachEvent 对于目前的 Opera 也适用。但是问题是 Mozilla/Firefox 并不支持这个方法。但是它支持另一个 addEventListener 方法,这个方法跟 attachEvent 差不多,也是用来给一个事件指派多个处理过程的。但是它们指派的事件有些区别,在 attachEvent 方法中,事件是以 “on” 开头的,而在 addEventListener 中,事件没有开头的 “on”,另外 addEventListener 还有第三个参数,一般这个参数指定为 false 就可以了。
因此要想在你的程序中给一个事件指派多个处理过程的话,只要首先判断一下浏览器,然后根据不同的浏览器,选择使用 attachEvent 还是 addEventListener 就可以了。实例如下:
if (document.all) {  
    window.attachEvent('onload', handler1);  
    window.attachEvent('onload', handler2);  
}  
else {  
    window.addEventListener('load', handler1, false);  
    window.addEventListener('load', handler2, false);  
} 
注意:attachEvent 所指派的多个过程的执行顺序是随机的,所以这几个过程之间不要有顺序依赖。另外 attachEvent 和 addEventListener 不仅仅适用于 window 对象,其他的一些对象也支持该方法。
function addEvent(obj, evenTypeName, fn){  
 if (obj.addEventListener){  
    obj.addEventListener(evenTypeName, fn, true);  
    return true;  
 } else if (obj.attachEvent){  
    return obj.attachEvent("on"+evenTypeName, fn);  
 } else {  
    return false;  
 }  
} 
Javascript 相关文章推荐
javascript 一个自定义长度的文本自动换行的函数
Aug 19 Javascript
javascript Array.prototype.slice使用说明
Oct 11 Javascript
node.js中的path.basename方法使用说明
Dec 09 Javascript
浅谈JavaScript异常处理语句
Jun 26 Javascript
jquery+html5烂漫爱心表白动画代码分享
Aug 24 Javascript
js实现仿购物车加减效果
Mar 01 Javascript
详解js类型判断
May 22 Javascript
Element ui 下拉多选时新增一个选择所有的选项
Aug 21 Javascript
浅谈laytpl 模板空值显示null的解决方法及简单的js表达式
Sep 19 Javascript
jQuery轮播图功能制作方法详解
Dec 03 jQuery
vue使用微信扫一扫功能的实现代码
Apr 11 Javascript
JavaScript模拟实现网易云轮播效果
Apr 04 Javascript
一个不错的用JavaScript实现的UBB编码函数
Mar 09 #Javascript
B/S开发中常用javaScript技术与代码
Mar 09 #Javascript
在线编辑器的实现原理(兼容IE和FireFox)
Mar 09 #Javascript
超级兔子让浮动层消失的前因后果
Mar 09 #Javascript
再谈IE中Flash控件的自动激活 ObjectWrap
Mar 09 #Javascript
javascript的对话框详解与参数
Mar 08 #Javascript
打开超链需要“确认”对话框的方法
Mar 08 #Javascript
You might like
php metaphone()函数的定义和用法
2016/05/15 PHP
Zend Framework校验器Zend_Validate用法详解
2016/12/09 PHP
php使用PDO事务配合表格读取大量数据插入操作实现方法
2017/02/16 PHP
破解Session cookie的方法
2006/07/28 Javascript
js 返回时间戳所对应的具体时间
2010/07/20 Javascript
发布一个基于javascript的动画类 Fx.js
2010/11/05 Javascript
javascript截取字符串(通过substring实现并支持中英文混合)
2013/06/24 Javascript
纯js简单日历实现代码
2013/10/05 Javascript
12306验证码破解思路分享
2015/03/25 Javascript
使用Meteor配合Node.js编写实时聊天应用的范例
2015/06/23 Javascript
AngularJS手动表单验证
2016/02/01 Javascript
聊一聊JS中this的指向问题
2016/06/17 Javascript
JavaScript实现经典排序算法之冒泡排序
2016/12/28 Javascript
Webpack中css-loader和less-loader的使用教程
2017/04/27 Javascript
利用JS实现scroll自定义滚动效果详解
2017/10/17 Javascript
node.js+express+mySQL+ejs+bootstrop实现网站登录注册功能
2018/01/12 Javascript
Node.js文件编码格式的转换的方法
2018/04/27 Javascript
详解vue使用插槽分发内容slot的用法
2019/03/28 Javascript
微信小程序中使用 async/await的方法实例分析
2020/05/06 Javascript
[33:39]DOTA2上海特级锦标赛C组小组赛#2 LGD VS Newbee第二局
2016/02/27 DOTA
python删除特定文件的方法
2015/07/30 Python
Python查看微信撤回消息代码
2018/06/07 Python
使用sklearn进行对数据标准化、归一化以及将数据还原的方法
2018/07/11 Python
Python和Java的语法对比分析语法简洁上python的确完美胜出
2019/05/10 Python
对pyqt5多线程正确的开启姿势详解
2019/06/14 Python
python3的print()函数的用法图文讲解
2019/07/16 Python
关于tf.nn.dynamic_rnn返回值详解
2020/01/20 Python
英国最大的电子产品和家电零售企业:Currys PC World
2016/09/24 全球购物
阿联酋手表和配饰购物网站:Rivolishop
2019/11/25 全球购物
捷克购买家具网站:JENA nábytek
2020/03/19 全球购物
残疾人小组计划书
2014/04/27 职场文书
大学生党员学习焦裕禄精神思想汇报
2014/09/10 职场文书
生产操作工岗位职责
2014/09/16 职场文书
教师三严三实学习心得体会
2014/10/11 职场文书
幼儿园六一主持词开场白
2015/05/28 职场文书
嵌入式Redis服务器在Spring Boot测试中的使用教程
2021/07/21 Redis