关于原生事件绑定中attachEvent与addEventlistener中兼容性以及attachEvent函数中this指代window问题
来源:互联网 发布:mac 连接阿里云服务器 编辑:程序博客网 时间:2024/05/02 11:49
在原生事件绑定中IE绑定中需要用到attachEvent,FF与chrome中需要用到addEventListener.
attachEvent(事件,函数)
例如:var oBtn = document.getElementById('button');
oBtn.addachEvent('onclick',function(){
alert('a');
})
oBtn.addachEvent('onclick',function(){
alert('b');
})
addEventListener(事件,函数,false)
例如:var oBtn = document.getElementById('button');
oBtn.addEventListener('click',function(){
alert('a');
},false)
oBtn.addEventListener('click',function(){
alert('b');
},false)
上面大家可以看到运用事件绑定的时候,事件的区别 一个是用onclick 一个是用到click,所以FF与chrome中的事件是不带on,而IE是必须带on的
由于出现兼容性的问题 需要封装函数
function addEvent(obj,ev,fn){
if(obj.attachEvent){
//针对IE浏览器
obj.attachEvent('on'+ev,fn)
}else{
//针对FF与chrome
obj.addEventListener(ev,fn,false)
}
}
所以上述的实例可以改写成
addEvent(oBtn,'click',function(){
alert('a');
})
addEvent(oBtn,'click',function(){
alert('b');
})
但是函数中如果出现this的话
例如:
addEvent(oBtn,'click',function(){
alert(this);
})
得到的结果是不一样的 this在IE中弹出的window,在FF与chrome中指代的是当前对象
如果要用到当前对象需要对函数进一步改造
addEvent(oBtn,'click',function(ev){
var oEvent = ev||event;
var that=oEvent.srcElement||oEvent.target;
alert(that)
})
- 关于原生事件绑定中attachEvent与addEventlistener中兼容性以及attachEvent函数中this指代window问题
- JS: addEventListener 和 attachEvent 绑定的函数中this的区别
- JavaScript中,四种事件绑定方法及attachEvent与addEventListener的区别
- js中addEventListener与attachEvent兼容
- javascript中addEventListener(attachEvent)详解
- IE attachEvent绑定的函数中this引用
- javascript中 addEventListener和attachEvent以及element.onclick的区别
- js绑定事件方法:addEventListener与attachEvent的不同浏览器的兼容性写法
- 事件绑定的多种形态解决多种形态的浏览器兼容性问题(以及attachEvent中this指向的改变)
- javascript中addEventListener和attachEvent区别
- javascript中attachEvent、addEventListener用法和区别
- addEventListener和attachEvent以及事件句柄绑定的区别
- Javascript关于绑定事件方法attachEvent和addEventListener区别与兼容写法
- 事件处理中的this:attachEvent, addEventListener, onclick
- window.onload事件--attachEvent和addEventListener
- javascript addEventListener和attachEvent 事件绑定
- js绑定事件(attachEvent、addEventListener)传参
- 事件绑定demo——attachEvent/addEventListener
- 坚持写博客
- 如何用make menuconfig配置kernel
- 跨iPhone应用程序的方便,模块化的代码共享:静态库和跨项目的引用
- 无向回路的求法
- DWZ 表单提交重定向问题
- 关于原生事件绑定中attachEvent与addEventlistener中兼容性以及attachEvent函数中this指代window问题
- STL容器:map,multimap
- 矩阵论学习笔记六:广义逆矩阵
- Shell编程基础
- PIE使IE支持CSS3圆角盒阴影与渐变渲染
- 关于两个Activity实现页面跳转问题
- AIX几种 IO 类型概念的介绍
- 参考学习资料
- Android SDK目录结构(3)