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 ...
随机推荐
- URL中#符号的作用
转自http://blog.sina.com.cn/s/blog_6f9eb2dd0100sk97.html 一.#的涵义 #代表网页中的一个位置.其右面的字符,就是该位置的标识符.比如, ...
- 我对PageRank的理解及R语言实现
PageRank,网页排名,又称网页级别.Google左侧排名或佩奇排名,是一种由搜索引擎根据网页之间相互的超链接计算的技术,而作为网页排名的要素之一,以Google公司创办人拉里·佩奇(Larry ...
- 在64位ubuntu上安装alienbrain客户端
一.首先从Alienbrain_EN_10.5.zip安装包(网上可搜索下载)里提取出linux版安装文件:Installations/Clients/Linux/NoVM/install.bin并c ...
- es6基础系列四--字符串的拓展
1 for...of 字符串的遍历接口 for(let i of "abc"){ console.log(i); } // a // b // c 2 includes 是否包含某 ...
- redis集群搭建踩坑笔记
推荐参考教程:https://blog.csdn.net/pucao_cug/article/details/69250101 错误: from /usr/lib/ruby/2.3.0/rubygem ...
- Codeforces Round #558 (Div. 2)C(计算几何,排列组合,模拟)
#include<bits/stdc++.h>using namespace std;typedef struct{ double k,b;}node;node k[1000007];bo ...
- spring零配置AOP踩坑指南
今天照着书,试着配了AOP(全注解),结果踩了各种坑,后来参考书附带的源码,终于走出来了,现在总结一下 除了spring的jar包以外,还需要导入以下包: 1.Spring核心配置文件beans.xm ...
- “FreeTextBox”控件使用——Word编辑器
前言 在敲牛腩新闻发布系统时,添加新闻修改新闻的时候遇到了Word编辑器控件.它是引用了第三方控件,下面关于怎么引用该控件及其一些简单的使用方法进行分析. 内容 在网上找的该插件"FreeT ...
- MCP|ZCM|Investigating Lactococcus lactis MG1363 response to phage p2 infection at the proteome level(研究乳酸乳球菌MG1363在噬菌体p2感染后的蛋白质组水平变化)
一.概述: 噬菌体是特异性感染并最终杀死其细菌宿主的病毒.他们在所有生态系统中发挥着关键的生态作用.尽管经过了几十年的研究,噬菌体与细菌宿主之间的相互作用仍然知之甚少.本研究使用无标记定量蛋白质组学来 ...
- 自定义标签报 无法为TAG [my2:hello]加载标记处理程序类[null]
今天练习jsp自定义标签的时候,等我写好全部和检查万无一失的时候.执行然后报错了 无法为TAG [my2:hello]加载标记处理程序类[null] 我反复检查代码,发现代码也没什么问题.后面通过百度 ...