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 相关文章推荐
JSON 学习之JSON in JavaScript详细使用说明
Feb 23 Javascript
Js冒泡事件详解及阻止示例
Mar 21 Javascript
BootStrap Table后台分页时前台删除最后一页所有数据refresh刷新后无数据问题
Dec 28 Javascript
使用jQuery实现一个类似GridView的编辑,更新,取消和删除的功能
Mar 15 Javascript
jQuery选择器之子元素过滤选择器
Sep 28 jQuery
ztree实现左边动态生成树右边为内容详情功能
Nov 03 Javascript
Vue.js组件间的循环引用方法示例
Dec 27 Javascript
vue如何在自定义组件中使用v-model
May 14 Javascript
Node.js系列之安装配置与基本使用(1)
Aug 30 Javascript
js blob类型url的视频下载问题的解决
Nov 29 Javascript
vue搜索页开发实例代码详解(热门搜索,历史搜索,淘宝接口演示)
Apr 11 Javascript
vue实现列表拖拽排序的功能
Nov 02 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
快速配置PHPMyAdmin方法
2008/06/05 PHP
php面向对象全攻略 (二) 实例化对象 使用对象成员
2009/09/30 PHP
谷歌音乐搜索栏的提示功能php修正代码
2011/05/09 PHP
php实现的CSS更新类实例
2014/09/22 PHP
浅谈PHP正则表达式中修饰符/i, /is, /s, /isU
2014/10/21 PHP
php通过array_merge()函数合并关联和非关联数组的方法
2015/03/18 PHP
PHP中生成UUID自定义函数分享
2015/06/10 PHP
一段实用的php验证码函数
2016/05/19 PHP
PHP编写简单的App接口
2016/08/28 PHP
解决Laravel 使用insert插入数据,字段created_at为0000的问题
2019/10/11 PHP
通过event对象的fromElement属性解决热区设置主实体的一个bug
2008/12/22 Javascript
javascript 当前日期加(天、周、月、年)
2009/08/09 Javascript
json原理分析及实例介绍
2012/11/29 Javascript
jQuery实现点击标题输入详细信息
2013/04/16 Javascript
JS的Document属性和方法小结
2013/09/17 Javascript
JavaScript获取按钮所在form表单id的方法
2015/04/02 Javascript
JavaScript基于setTimeout实现计数的方法
2015/05/08 Javascript
jquery插件tytabs.jquery.min.js实现渐变TAB选项卡效果
2015/08/25 Javascript
关于Bootstrap弹出框无法调用问题的解决办法
2016/03/10 Javascript
Angular X中使用ngrx的方法详解(附源码)
2017/07/10 Javascript
Angularjs中ng-repeat的简单实例
2017/08/25 Javascript
基于canvas粒子系统的构建详解
2017/08/31 Javascript
jQuery实现通过方向键控制div块上下左右移动的方法【测试可用】
2018/04/26 jQuery
python修改txt文件中的某一项方法
2018/12/29 Python
Python 实现顺序高斯消元法示例
2019/12/09 Python
python批量替换文件名中的共同字符实例
2020/03/05 Python
用60行代码实现Python自动抢微信红包
2021/02/04 Python
canvas绘制视频封面的方法
2018/02/05 HTML / CSS
伦敦的高级牛仔布专家:Trilogy
2018/08/06 全球购物
英国名牌服装购物网站:OD’s Designer
2019/09/02 全球购物
办理护照介绍信
2014/01/16 职场文书
暑期社会实践个人总结
2015/03/06 职场文书
2015年学校关工委工作总结
2015/04/03 职场文书
2015年会计人员工作总结
2015/05/22 职场文书
Win11 Build 21996.1 Dev版怎么样? win11系统截图欣赏
2021/11/21 数码科技
SpringBoot 集成短信和邮件 以阿里云短信服务为例
2022/04/22 Java/Android