用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 相关文章推荐
jquery cookie插件代码类
May 26 Javascript
javascript禁用键盘功能键让右击及其他键无效
Oct 09 Javascript
常规表格多表头查询示例
Feb 21 Javascript
jquery easyui 对于开始时间小于结束时间的判断示例
Mar 22 Javascript
基于bootstrap实现广告轮播带图片和文字效果
Jul 22 Javascript
火狐和ie下获取javascript 获取event的方法(推荐)
Nov 26 Javascript
Bootstrap源码解读排版(1)
Dec 23 Javascript
AngularJS实现的回到顶部指令功能实例
May 17 Javascript
select标签设置默认选中的选项方法
Mar 02 Javascript
使用Node搭建reactSSR服务端渲染架构
Aug 30 Javascript
简单说说如何使用vue-router插件的方法
Apr 08 Javascript
如何在JavaScript中等分数组的实现
Dec 13 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字符编码转换之gb2312转为utf8
2013/10/28 PHP
PHP中if和or运行效率对比
2014/12/12 PHP
用jQuery获取IE9下拉框默认值问题探讨
2013/07/22 Javascript
从零学JS之你需要了解的几本书
2014/05/19 Javascript
jQuery判断复选框是否勾选的原理及示例
2014/05/21 Javascript
判断日期是否能跨月查询的js代码
2014/07/25 Javascript
js style动态设置table高度
2014/10/21 Javascript
jQuery实现简易的天天爱消除小游戏
2015/10/16 Javascript
jQuery animate和CSS3相结合实现缓动追逐效果附源码下载
2016/04/18 Javascript
深入理解jquery跨域请求方法
2016/05/18 Javascript
Nodejs下用submit提交表单提示cannot post错误的解决方法
2016/11/21 NodeJs
详解jQuery简单的表格应用
2016/12/16 Javascript
JS实现的验证身份证及获取地区功能示例
2017/01/16 Javascript
AngularJS学习第二篇 AngularJS依赖注入
2017/02/13 Javascript
vue.js中过滤器的使用教程
2017/06/08 Javascript
详解如何使用PM2将Node.js的集群变得更加容易
2017/11/15 Javascript
JS中常用的消息框总结
2018/02/24 Javascript
Vue登录注册并保持登录状态的方法
2018/08/17 Javascript
vue实现条件叠加搜索的解决方法
2019/05/28 Javascript
vue实例的选项总结
2020/06/09 Javascript
Python多线程编程(五):死锁的形成
2015/04/05 Python
Python双精度浮点数运算并分行显示操作示例
2017/07/21 Python
使用Python和xlwt向Excel文件中写入中文的实例
2018/04/21 Python
对python xlrd读取datetime类型数据的方法详解
2018/12/26 Python
PyTorch搭建一维线性回归模型(二)
2019/05/22 Python
seek引发的python文件读写的问题及解决
2019/07/26 Python
python GUI库图形界面开发之PyQt5信号与槽机制、自定义信号基础介绍
2020/02/25 Python
Python 没有main函数的原因
2020/07/10 Python
HTML5 Canvas实现360度全景图的示例代码
2018/01/29 HTML / CSS
video.js支持m3u8格式直播的实现示例
2020/05/20 HTML / CSS
函授教育个人学习的自我评价
2013/12/31 职场文书
小学教师师德师风自我剖析材料
2014/09/29 职场文书
遗嘱继承权公证书
2015/01/26 职场文书
离婚上诉状范文
2015/05/23 职场文书
告知书格式
2015/07/01 职场文书
《学会看病》教学反思
2016/02/17 职场文书