用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的高性能TreeView(asp.net)
Feb 23 Javascript
javascript 基础篇3 类,回调函数,内置对象,事件处理
Mar 14 Javascript
基于JavaScript 数据类型之Boolean类型分析介绍
Apr 19 Javascript
用js判断输入是否为中文的函数
Mar 10 Javascript
js限制checkbox选中个数以限制六个为例
Jul 15 Javascript
node.js中的fs.futimes方法使用说明
Dec 17 Javascript
jQuery层级选择器实例代码
Feb 06 Javascript
浅析JavaScript中var that=this
Feb 17 Javascript
详解Chart.js轻量级图表库的使用经验
May 22 Javascript
angularjs的单选框+ng-repeat的实现方法
Sep 12 Javascript
Electron autoUpdater实现Windows安装包自动更新的方法
Dec 24 Javascript
详解Anyscript开发指南绕过typescript类型检查
Sep 23 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永久登录、记住我功能实现方法和安全做法
2015/04/27 PHP
javascript parseInt 函数分析(转)
2009/03/21 Javascript
JQuery 表格操作(交替显示、拖动表格行、选择行等)
2009/07/29 Javascript
基于jquery的当鼠标滚轮到最底端继续加载新数据思路分享(多用于微博、空间、论坛 )
2011/10/10 Javascript
基于jquery固定于顶部的导航响应浏览器滚动条事件
2014/11/02 Javascript
JavaScript实现列出数组中最长的连续数
2014/12/29 Javascript
js生成随机数的方法实例
2015/10/16 Javascript
Bootstrap导航条可点击和鼠标悬停显示下拉菜单的实现代码
2016/06/23 Javascript
JavaScript定时器制作弹窗小广告
2017/02/05 Javascript
详解webpack 配合babel 将es6转成es5 超简单实例
2017/05/02 Javascript
js实现图片懒加载效果
2017/07/17 Javascript
bootstrap confirmation按钮提示组件使用详解
2017/08/22 Javascript
小程序实现页面顶部选项卡效果
2018/11/06 Javascript
vuex实现及简略解析(小结)
2019/03/01 Javascript
Vue 中使用lodash对事件进行防抖和节流操作
2020/07/26 Javascript
JS实现拖动模糊框特效
2020/08/25 Javascript
tornado捕获和处理404错误的方法
2014/02/26 Python
Python 专题三 字符串的基础知识
2017/03/19 Python
python之当你发现QTimer不能用时的解决方法
2019/06/21 Python
pytorch 归一化与反归一化实例
2019/12/31 Python
python 解压、复制、删除 文件的实例代码
2020/02/26 Python
python怎么自定义捕获错误
2020/06/29 Python
Java byte数组操纵方式代码实例解析
2020/07/22 Python
CSS3动画:5种预载动画效果实例
2017/04/05 HTML / CSS
Html5与App的通讯方式详解
2019/10/24 HTML / CSS
美国网上鞋子零售商:Dr. Scholl’s Shoes
2017/11/17 全球购物
台湾租车首选品牌:IWS艾维士租车
2019/05/03 全球购物
合作协议书范本
2014/04/17 职场文书
超市活动计划书
2014/04/24 职场文书
活动总结报告怎么写
2014/07/03 职场文书
房贷收入证明范本
2015/06/12 职场文书
小学体育跳绳课教学反思
2016/02/16 职场文书
2019年大学生职业生涯规划书
2019/03/25 职场文书
Redis 常见使用场景
2021/08/30 Redis
英国数字版游戏销量周榜公布 《小缇娜的奇幻之地》登顶
2022/04/03 其他游戏
python DataFrame中stack()方法、unstack()方法和pivot()方法浅析
2022/04/06 Python