JS在IE和FF下attachEvent,addEventListener学习笔记


Posted in Javascript onNovember 26, 2009

对象名.addEventListener("事件名(不带ON)",函数名,true/false);(FF下)
对象名.attachEvent("事件名",函数名);(IE下)
说明:

事件名称,要注意的是"onclick"要改为"click","onblur"要改为"blur",也就是说事件名不要带"on"。
函数名,记住不要跟括号最后一个参数是个布尔值,表示该事件的响应顺序,下面重点介绍一下addEventListener的第3个参数(useCapture)。 userCapture若为true,则浏览器采用Capture,若为false则采用bubbing方式。建议用false,看个例子吧。
html代码
<div id="div_test"> <input type="button" id="btn_test" value="se4.cn技术基地" /> </div>
js代码

window.onload=function(){ document.getElementById("div_test").addEventListener("click",test1,false); document.getElementById("btn_test").addEventListener("click",test2,false); } function test1(){ alert("外层div触发") } function test2(){ alert("内层input触发") }

自己体验一下,如果userCapture是true则test1先触发,如果userCapture是false则test2先触发。

下面来说一下,attachEvent
这个没啥好说的,相信大家也都用的挺熟的,主要是传参那块,等我用到 再说吧,哈哈哈

示例:
创建绑定方法:

if (typeof document.addEventListener != "undefined") { 
document.addEventListener("mousedown",_lhlclick,true); 
} else { 
document.attachEvent("onmousedown",_lhlclick); 
}

删除事件:
if (typeof document.addEventListener != "undefined") { 
document.removeEventListener("mousedown",_lhlclick,true); 
} else { 
document.detachEvent("onmousedown",_lhlclick); 
}
Javascript 相关文章推荐
jquery 页面全选框实践代码
Apr 02 Javascript
使用JavaScript链式编程实现模拟Jquery函数
Dec 21 Javascript
ECMAScript6块级作用域及新变量声明(let)
Jun 12 Javascript
Hallo.js基于jQuery UI所见即所得的Web编辑器
Jan 26 Javascript
JSON对象 详解及实例代码
Oct 18 Javascript
js实现文字跑马灯效果
Feb 23 Javascript
H5实现中奖记录逐行滚动切换效果
Mar 13 Javascript
在vue-cli脚手架中配置一个vue-router前端路由
Jul 03 Javascript
vue2.0移动端滑动事件vue-touch的实例代码
Nov 27 Javascript
Vue.js中该如何自己维护路由跳转记录
May 19 Javascript
使用layui的router来进行传参的实现方法
Sep 06 Javascript
javascript设计模式 ? 建造者模式原理与应用实例分析
Apr 10 Javascript
JS小框架 fly javascript framework
Nov 26 #Javascript
jquery.ui.progressbar 中文文档
Nov 26 #Javascript
javascript 面向对象继承
Nov 26 #Javascript
javascript 获取元素位置的快速方法 getBoundingClientRect()
Nov 26 #Javascript
javascript或asp实现的判断身份证号码是否正确两种验证方法
Nov 26 #Javascript
Ext grid 添加右击菜单
Nov 26 #Javascript
JS 判断undefined的实现代码
Nov 26 #Javascript
You might like
php trim 去除空字符的定义与语法介绍
2010/05/31 PHP
PHP下操作Linux消息队列完成进程间通信的方法
2010/07/24 PHP
php 目录与文件处理-郑阿奇(续)
2011/07/04 PHP
PHP小技巧之JS和CSS优化工具Minify的使用方法
2014/05/19 PHP
php使用json_decode后数字对象转换成了科学计数法的解决方法
2017/02/20 PHP
php使用ftp实现文件上传与下载功能
2017/07/21 PHP
jQuery select操作控制方法小结
2010/05/26 Javascript
node.js中的buffer.Buffer.byteLength方法使用说明
2014/12/10 Javascript
js显示文本框提示文字的方法
2015/05/07 Javascript
javascript设置页面背景色及背景图片的方法
2015/12/29 Javascript
如何使用AngularJs打造权限管理系统【简易型】
2016/05/09 Javascript
浅析如何利用angular结合translate为项目实现国际化
2016/12/08 Javascript
代码详解javascript模块加载器
2018/03/04 Javascript
layui table设置前台过滤转义等方法
2018/08/17 Javascript
JS/HTML5游戏常用算法之碰撞检测 包围盒检测算法详解【矩形情况】
2018/12/13 Javascript
AngularJs中$cookies简单用法分析
2019/05/30 Javascript
Openlayers+EasyUI Tree动态实现图层控制
2020/09/28 Javascript
[03:09]DOTA2亚洲邀请赛 LGD战队出场宣传片
2015/02/07 DOTA
[01:34]DAC2018主赛事第四日五佳镜头 Gh巨牙海民助Miracle-死里逃生
2018/04/07 DOTA
python中迭代器(iterator)用法实例分析
2015/04/29 Python
Python list操作用法总结
2015/11/10 Python
pycharm修改界面主题颜色的方法
2019/01/17 Python
Python socket服务常用操作代码实例
2020/06/22 Python
CSS3颜色值RGBA与渐变色使用介绍
2020/03/06 HTML / CSS
HTML5 实战PHP之Web页面表单设计
2011/10/09 HTML / CSS
简述Html5 IphoneX 适配方法
2018/02/08 HTML / CSS
高中运动会广播稿
2014/01/21 职场文书
宝宝满月酒主持词和仪式流程
2014/03/27 职场文书
车辆年审委托书范本
2014/09/18 职场文书
学生会工作感言
2015/08/07 职场文书
远程教育培训心得体会
2016/01/09 职场文书
python urllib库的使用详解
2021/04/13 Python
MySQL 常见的数据表设计误区汇总
2021/06/07 MySQL
Python使用海龟绘图实现贪吃蛇游戏
2021/06/18 Python
使用Redis实现实时排行榜功能
2021/07/02 Redis
python获取对象信息的实例详解
2021/07/07 Python