统一addEventListener与attachEvent中this指向问题
1、this指向问题
使用addEventListener注册的事件,事件处理函数中 this指向目标元素;
使用attachEvent注册的事件,事件处理函数中 this指向window对象
要想将二者统一,可采用下面方法:
function addEvent(ele,evtType,handler){
if(ele.addEventListener){
ele.addEventListener(evtType,handler,false);
}else if(ele.attachEvent){
ele.attachEvent('on'+evtType,function (event){
handler.call(ele,event); //改变事件处理函数中的this指向
});
}
}
2、调用顺序:
通过对象属性或html属性注册的事件,会优先被调用
addEventListener注册的事件,按照注册顺序执行
attachEvent注册的事件,可能按任何顺序执行 (IE8及之前版本,一般会和注册顺序相反)IE9之后,支持addEventListener
3、事件处理函数返回值
通过对象属性或html属性注册的事件,通过返回false,可以阻止事件的默认行为
addEventListener注册的事件,通过preventDefault()方法阻止
attachEvent注册的事件,通过设置事件对象的returnValue属性为false
统一addEventListener与attachEvent中this指向问题的更多相关文章
- attachEvent 中this指向
IE中使用的事件绑定函数与Web标准的不同,而且this指向也不一样,Web标签中的this指向与传统事件绑定中的this一样,是当前目标,但是IE中事件绑定函数中this指向,通过使用call或ap ...
- Javascript中addEventListener和attachEvent的区别
在利用javascript为DOM Element添加事件处理程序时,如果要想下兼容IE6,7时,就不得不考虑addEventListener与attachEvent的异同. 1.首先说下addEve ...
- addEventListener和attachEvent二者绑定的执行函数中的this不相同【转载】
yuanwen http://www.jb51.net/article/32511.htm 写 addEventListener 和 attachEvent 区别的博文不少,不过大部分都把重点放置于前 ...
- addEventListener和attachEvent以及element.onclick的区别
addEventListener和attachEvent以及element.onclick的区别 attachEvent是ie添加事件处理程序,接收两个参数,其中事件类型名称要加"on&qu ...
- addEventListener和attachEvent的区别(转载)
attachEvent 与addEventListener到底有什么区别呢?总结如下: 一.适应的浏览器版本不同 attachEvent——兼容:IE7.IE8:不兼容firefox.chrome.I ...
- 注册事件处理程序onclick和addEventListener、attachEvent
一.设置HTML标签属性为事件处理程序(注意和下面的设置javascript对象属性为事件处理程序是不同的) 用于设置文档元素事件处理程序属性也能化成对应的HTML标签的属性.如果这样做,属性值应该是 ...
- addEventListener()及attachEvent()区别分析
Javascript 的addEventListener()及attachEvent()区别分析 Mozilla中: addEventListener的使用方式: target.addEventLis ...
- addEventListener 与attachEvent
第一:简单的通用方法(IE && FF) window.onload = function(){ var oDiv = document.getElementById("J_ ...
- JavaScript中this指向的简单理解
首先必须要说的是,this的指向在函数定义的时候是确定不了的,只有函数执行的时候才能确定this到底指向谁,实际上this的最终指向的是那个调用它的对象(这句话有些问题,后面会解释为什么会有问题,虽然 ...
随机推荐
- Spring事务源码阅读笔记
1. 背景 本文主要介绍Spring声明式事务的实现原理及源码.对一些工作中的案例与事务源码中的参数进行总结. 2. 基本概念 2.1 基本名词解释 名词 概念 PlatformTransaction ...
- E. Exposition
E. Exposition time limit per tes ...
- 【笔记】Kali linux的安装 和 一些使用前的准备工作(原创+转载)
该博文只记录笔者的蛇皮使用经历,纯新手= =,可能借鉴意义也可能没有(T _ T),侵删. 目录 kali linux 在个人计算机和在VirtualBox下的安装 kali linux 使用前准备工 ...
- MongoDB数据库的安装、配置和使用
1.下载安装包 wget https://fastdl.mongodb.org/linux/mongodb-linux-x86_64-3.4.7.tgz 2.解压安装包 tar -zxf mo ...
- SQLServer中SQL语句与可执行二进制语句
SQLServer可以执行正常SQL语句也可以执行被转换的二进制语句,一般会用此方法进行数据库注入操作,骗过基本的字符过滤 --将二进制格式转为普通SQL语句 ) = 0x53454C45435420 ...
- FPGA多时钟处理应用
FPGA项目设计中,通常会遇到多时钟处理.即一个PLL输出多个时钟,根据条件选择合适的时钟用作系统时钟.方案一: 外部晶振时钟进入PLL,由PLL输出多个时钟,MUX根据外部条件选择时钟输出做为系统使 ...
- web基础系列(五)---https是如何实现安全通信的
https是如何实现安全通信的 如果有不正确的地方,还望指出! web基础系列目录 总结几种常见web攻击手段极其防御方式 总结几种常见的安全算法 回顾 总结几个概念(具体描述可以看上一篇文章) 数字 ...
- android6.0 SerialPort 服务
上一篇博客描述了一个简单的串口应用程序和驱动程序,了解了应用程序访问串口的基本操作,如打开串口,设置串口,写串口,读串口,关闭串口等.和Linux串口驱动的基本框架.这里将了解Android下的串口系 ...
- 【JDK1.8】Java 8源码阅读汇总
一.前言 万丈高楼平地起,相信要想学好java,仅仅掌握基础的语法是远远不够的,从今天起,笔者将和园友们一起阅读jdk1.8的源码,并将阅读重点放在常见的诸如collection集合以及concu ...
- ftpclient 550 permission denied
遇到一个坑,ftp服务器有主被动模式,如果ftpclient 没有设置模式,默认就是主动模式,如果ftp服务器是被动模式,那么使用ftpclient就执行上传和下载,就会失败, 添加ftpClient ...