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 相关文章推荐
javascript 嵌套的函数(作用域链)
Mar 15 Javascript
解决IE下select标签innerHTML插入option的BUG(兼容IE,FF,Opera,Chrome,Safari)
May 13 Javascript
原生js编写设为首页兼容ie、火狐和谷歌
Jun 05 Javascript
JavaScript面向对象之私有静态变量实例分析
Jan 14 Javascript
javascript事件冒泡简单示例
Jun 20 Javascript
JS匿名函数实例分析
Nov 26 Javascript
CSS+jQuery实现简单的折叠菜单
Dec 20 Javascript
Vue.js学习笔记之常用模板语法详解
Jul 25 Javascript
vue+vant实现商品列表批量倒计时功能
Jan 13 Javascript
ssm+vue前后端分离框架整合实现(附源码)
Jul 08 Javascript
js+canvas实现五子棋小游戏
Aug 02 Javascript
js实现磁性吸附的示例
Oct 26 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实现智能文件类型检测的实现代码
2011/08/02 PHP
关于PHPDocument 代码注释规范的总结
2013/06/25 PHP
CI框架中cookie的操作方法分析
2014/12/12 PHP
PHP+MySQL插入操作实例
2015/01/21 PHP
服务器上配置PHP运行环境教程
2015/02/12 PHP
利用PHP实现一个简单的用户登记表示例
2017/04/25 PHP
Aster vs Newbee BO5 第一场2.19
2021/03/10 DOTA
JavaScript多线程的实现方法
2007/05/08 Javascript
从URL中提取参数与将对象转换为URL查询参数的实现代码
2012/01/12 Javascript
jquery、js操作checkbox全选反选
2014/03/12 Javascript
node.js中的http.response.removeHeader方法使用说明
2014/12/14 Javascript
js实现鼠标经过表格行变色的方法
2015/05/12 Javascript
Javascript实现div层渐隐效果的方法
2015/05/30 Javascript
jQuery实现简单漂亮的Nav导航菜单效果
2017/03/29 jQuery
Vue.js进行查询操作的实例详解
2017/08/25 Javascript
阿望教你用vue写扫雷小游戏
2020/01/20 Javascript
详解react组件通讯方式(多种)
2020/05/06 Javascript
Vuex的热更替如何实现
2020/06/05 Javascript
javascript实现打砖块小游戏(附完整源码)
2020/09/18 Javascript
Python 的类、继承和多态详解
2017/07/16 Python
安装python时MySQLdb报错的问题描述及解决方法
2018/03/20 Python
pandas通过索引进行排序的示例
2018/11/16 Python
python xlwt如何设置单元格的自定义背景颜色
2019/09/03 Python
PyCharm无法识别PyQt5的2种解决方法,ModuleNotFoundError: No module named 'pyqt5'
2020/02/17 Python
Django choices下拉列表绑定实例
2020/03/13 Python
python IDLE添加行号显示教程
2020/04/25 Python
PyQt5连接MySQL及QMYSQL driver not loaded错误解决
2020/04/29 Python
在TensorFlow中实现矩阵维度扩展
2020/05/22 Python
你不知道的5个HTML5新功能
2016/06/28 HTML / CSS
HTML5 video播放器全屏(fullScreen)方法实例
2015/04/24 HTML / CSS
马来西亚在线购物:POPLOOK.com
2019/12/09 全球购物
《鸟岛》教学反思
2014/04/26 职场文书
英语教师个人工作总结
2015/02/09 职场文书
2015教师个人师德工作总结
2015/10/23 职场文书
mysql5.7的安装及Navicate长久免费使用的实现过程
2021/11/17 MySQL
利用Python多线程实现图片下载器
2022/03/25 Python