javascript attachEvent和addEventListener使用方法


Posted in Javascript onMarch 19, 2009

attachEvent方法 按钮onclick
addEventListener方法 按钮click
两者使用的原理:可对执行的优先级不一样,下面实例讲解如下:
attachEvent方法,为某一事件附加其它的处理事件。(不支持Mozilla系列)
addEventListener方法 用于 Mozilla系列
举例:
Java代码

document.getElementById("btn").onclick = method1; 
document.getElementById("btn").onclick = method2; 
document.getElementById("btn").onclick = method3;

如果这样写,那么将会只有medhot3被执行
写成这样:
Java代码:
var btn1Obj = document.getElementById("btn1"); 
//object.attachEvent(event,function); 
btn1Obj.attachEvent("onclick",method1); 
btn1Obj.attachEvent("onclick",method2); 
btn1Obj.attachEvent("onclick",method3);

执行顺序为method3->method2->method1
如果是Mozilla系列,并不支持该方法,需要用到addEventListener
Java代码:
var btn1Obj = document.getElementById("btn1"); 
//element.addEventListener(type,listener,useCapture); 
btn1Obj.addEventListener("click",method1,false); 
btn1Obj.addEventListener("click",method2,false); 
btn1Obj.addEventListener("click",method3,false);

执行顺序为method1->method2->method3
使用实例:
1。 Java代码:
var el = EDITFORM_DOCUMENT.body; 
//先取得对象,EDITFORM_DOCUMENT实为一个iframe 
if (el.addEventListener)...{ 
el.addEventListener('click', KindDisableMenu, false); 
} else if (el.attachEvent)...{ 
el.attachEvent('onclick', KindDisableMenu); 
}

2。 Java代码:
if (window.addEventListener){ 
window.addEventListener('load', _uCO, false); 
} else if (window.attachEvent){ 
window.attachEvent('onload', _uCO); 
}
Javascript 相关文章推荐
innerText 使用示例
Jan 23 Javascript
javascript中var的重要性分析
Feb 11 Javascript
jQuery语法小结(超实用)
Dec 31 Javascript
vue.js表格分页示例
Oct 18 Javascript
EasyUI在Panel上动态添加LinkButton按钮
Aug 11 Javascript
Vue 实现双向绑定的四种方法
Mar 16 Javascript
在vue中使用echarts图表实例代码详解
Oct 22 Javascript
深入理解JS异步编程-Promise
Jun 03 Javascript
layui的数据表格+springmvc实现搜索功能的例子
Sep 28 Javascript
element-ui如何防止重复提交的方法步骤
Dec 09 Javascript
vue-drag-chart 拖动/缩放图表组件的实例代码
Apr 10 Javascript
JS+CSS实现过渡特效
Jan 02 Javascript
for 循环性能比较 提高for循环的效率
Mar 19 #Javascript
js no-repeat写法 背景不重复
Mar 18 #Javascript
javascript 避免闭包引发的问题
Mar 17 #Javascript
用JavaScript编写COM组件的步骤
Mar 17 #Javascript
IE6与IE7中,innerHTML获取param的区别
Mar 15 #Javascript
InnerHtml和InnerText的区别分析
Mar 13 #Javascript
JavaScript 快捷键设置实现代码
Mar 13 #Javascript
You might like
PHP中PDO基础教程 入门级
2011/09/04 PHP
PHPExcel简单读取excel文件示例
2016/05/26 PHP
JS 仿腾讯发表微博的效果代码
2013/12/25 Javascript
nodejs获取本机内网和外网ip地址的实现代码
2014/06/01 NodeJs
多个js毫秒倒计时同时进行效果
2016/01/05 Javascript
jQuery的each循环用法简单示例
2016/06/12 Javascript
jQuery 调用WebService 实例讲解
2016/06/28 Javascript
jquery动态遍历Json对象的属性和值的方法
2016/07/27 Javascript
微信小程序 中wx.chooseAddress(OBJECT)实例详解
2017/03/31 Javascript
详解vantUI框架在vue项目中的应用踩坑
2018/12/06 Javascript
vue之a-table中实现清空选中的数据
2019/11/07 Javascript
vue.js 子组件无法获取父组件store值的解决方式
2019/11/08 Javascript
原生JavaScript实现的无缝滚动功能详解
2020/01/17 Javascript
[02:10]DOTA2 TI10勇士令状玩法及不朽Ⅰ展示:焕新世界,如你所期
2020/05/29 DOTA
[56:38]DOTA2-DPC中国联赛正赛Aster vs Magma BO3 第一场 3月5日
2021/03/11 DOTA
Python Web框架Tornado运行和部署
2020/10/19 Python
python 垃圾收集机制的实例详解
2017/08/20 Python
Python设计模式之观察者模式原理与用法详解
2019/01/16 Python
Python实现的大数据分析操作系统日志功能示例
2019/02/11 Python
Python列表对象实现原理详解
2019/07/01 Python
python如何代码集体右移
2020/07/20 Python
Python 绘制可视化折线图
2020/07/22 Python
css3 仿写阿里云水纹效果的示例代码
2018/02/10 HTML / CSS
在印度上传处方,在线订购药品:Medlife
2019/03/28 全球购物
红色故事演讲稿
2014/05/22 职场文书
企业晚会策划方案
2014/05/29 职场文书
2014年仓库工作总结
2014/11/20 职场文书
祝寿主持词
2015/07/02 职场文书
聘任通知书
2015/09/21 职场文书
交通安全学习心得体会
2016/01/18 职场文书
Pytorch 使用tensor特定条件判断索引
2021/04/08 Python
Java面试题冲刺第十九天--数据库(4)
2021/08/07 Java/Android
教你在 Java 中实现 Dijkstra 最短路算法的方法
2022/04/08 Java/Android
【D4DJ】美少女DJ企划 动画将于明年冬季开播第2季
2022/04/11 日漫
SQL Server 忘记密码以及重新添加新账号
2022/04/26 SQL Server
css中有哪些方式可以隐藏页面元素及区别
2022/06/16 HTML / CSS