js绑定事件方法:addEventListener的兼容问题
js的事件绑定方法中,ie只支持attachEvent,而FF和Chrome只支持addEventListener;严格来说:addEventListener只有IE9以上版本的IE浏览器上能够兼容,IE8或者更低的版本是不支持,这时要想能够兼容IE低版本浏览器就需要判断当前浏览器然后针对不同浏览器决定用哪一个。
attachEvent和addEventLitener的不同之处是第二个参数事件名要多加个“on”,比如‘onclick’,而且他的this 指向的是window,在使用的时候需要改变this指向。下面就是一个兼容的写法:
var Event = {};
Event.addEvents = function(target,eventType,handle){
if(document.addEventListener){
Event.addEvents = function(target,eventType,handle){
target.addEventListener(eventTypt,handle,false);
};
}else {
Event.addEvents = function(target,eventType,handle){
target.attachEvent('on'+eventType,function(){
handle.call(target,arguments);
});
};
}
Event.addEvents(target,eventType,handle);
}
调用方法:
Event.addEvents(document,"click",function(){
alert(ok)
});
js绑定事件方法:addEventListener的兼容问题的更多相关文章
- js绑定事件方法:addEventListener与attachEvent的不同浏览器的兼容性写法
js的事件绑定方法中,ie仅仅支持attachEvent,而FF和Chrome仅仅支持addEventListener,所以就必须为这两个方法做兼容处理,原理是先推断attachEvent仅仅否为真( ...
- JqueryOn绑定事件方法介绍
JqueryOn绑定事件方法介绍 1. 简介 (1) On()方法在被选及子元素上添加一个或多个事件处理程序 (2) 在jquery 版本1.7起,on()方法是bind(),live()和deleg ...
- jQuery绑定事件方法及区别(bind,click,on,live,one)
第一种方式: ? 1 2 3 4 5 $(document).ready(function(){ $("#clickme").click(function(){ alert(& ...
- 原生JS事件绑定方法以及jQuery绑定事件方法bind、live、on、delegate的区别
一.原生JS事件绑定方法: 1.通过HTML属性进行事件处理函数的绑定如: <a href="#" onclick="f()"> 2.通过JavaS ...
- JS绑定事件和移除事件的处理方法
addEventListener()与removeEventListener()用于处理指定和删除事件处理程序操作.所有的DOM节点中都包含这两种方法,并且它们都接受3个参数:要处理的事件名.作为事件 ...
- js绑定事件和解绑事件
在js中绑定多个事件用到的是两个方法:attachEvent和addEventListener,但是这两个方法又存在差异性 attachEvent方法 只支持IE678,不兼容其他浏览器 addEv ...
- 学习之js绑定事件
由于ie中绑定事件的bug,所以产生了用原生的实践操作来模拟事件绑定的方法,跟着李炎恢学的一招. function addEvent(obj, type, fn){ if(obj.addEventLi ...
- js绑定事件代理的坑
js通过事件代理的方式绑定跳转事件,我这里的逻辑是把click事件绑定在最外层container上面,如果e.target包含我已经写好的class,则执行跳转逻辑.但是这种方式好像只能是在点击的元素 ...
- [jquery]高级篇--js绑定事件
参考: http://www.cnblogs.com/leejersey/p/3545372.html jQuery on()方法是官方推荐的绑定事件的一个方法.$(selector).on(eve ...
随机推荐
- Mahout0.9 – Clustering (聚类篇)
Mahout – Clustering (聚类篇) Leave a reply 什么是Mahout? " Apache Mahout™ project's goal is to build ...
- c/c++进制转换练习
1 下列数最大的是( ).括号内为数字,括号外为进制.(360集团) (10010101)2 (227)8------>10010111 (96)16------>10010110 (14 ...
- IDEA拷贝git上的最新项目资源
File->new ->project version control->git-> 进入项目git对应的网址,选择第一个backstop,复制url: 输入git用户名和密码 ...
- 发现fork容易出错的一个地方
今天在看代码时发现一段有意思的代码 #include<stdio.h> #include<stdlib.h> #include<unistd.h> #include ...
- hdu1082
#include<iostream> #include<stack> #include<string> #include<cctype> using n ...
- 2016 年排名 Top 100 的 Java 类库
我们分析了GitHub中47,251个依赖,从中找出了排名前一百的Java类库,让我们看看谁在前面,谁在后面. 我们在漫长的周末的消遣方式就是浏览GitHub并且搜索流行的Java类库.我们决定把其中 ...
- gitlab 502解决方案
gitlab突然出现502 尝试gitlab-ctl restart.gitlab-ctl reconfigure 无效. 之后做法: #查看git日志 gitlab-ctl tail发现日志报错:端 ...
- kolla-build常用命令行详解
--base-image 用于指定使用自己定制的基础镜像,不用官方网站的样例如下:kolla-build --base-image registry.access.redhat.com/rhel7/r ...
- Hadoop 对MapReduce的理解
对MapReduce的理解 客户端启动一个作业 向JobTraker请求一个JobId 将资源文件复制到HDFS上,包括Jar文件,配置文件,输入划分信息等 接收作业后,进入作业队列,根据输入划分信息 ...
- Codevs 1080 线段树练习(CDQ分治)
1080 线段树练习 时间限制: 1 s 空间限制: 128000 KB 题目等级 : 钻石 Diamond 题解 题目描述 Description 一行N个方格,开始每个格子里都有 ...