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 ...
随机推荐
- Linux服务器监控工具--Nmon介绍
一.Nmon介绍(详细请参考百度百科) 是一款分析 AIX 和 Linux 性能的免费工具,这个高效的工具可以工作于任何哑屏幕.telnet 会话.甚至拨号线路.另外,它并不会消耗大量的 CPU 周期 ...
- Spring IOC 少
控制反转好处 IOC:控制反转也叫依赖注入,IOC利用java反射机制,AOP利用代理模式.所谓控制反转是指,本来被调用者的实例是有调用者来创建的,这样的缺点是耦合性太强,IOC则是统一交给sprin ...
- Web 应用之数据库的配置 与链接 Mysql
source 绝对路径.sql(绝对路径是对应数据库版本包下的) source时是有先后顺序的必须是create 在insert 在 下面是链接,上面是把数据导入到数据库中,数据也可以自己写进去. 配 ...
- IOS 完成来电归属地
首先是一个库:(有时间在上传) 然后设置一个工具类 .h @interface HMFoundLocation : NSObject AS_SINGLETON(HMFoundLocation) @pr ...
- PHP现阶段发现的不足点
1.php测试单元的实现(参考文档:https://blog.csdn.net/weixin_41282397/article/details/85052015)
- vue打包之后生成一个配置文件修改请求接口
问题描述: 在npm run build 生成dist后,url配置也被固定了,传到运行的前端服务器上后,假设某次,api服务器的ip修改了,改动只是更新下这个url,但是却需要回到前端源码,修改ur ...
- 关于after和before
你可曾'百度一下'? 在以前的很多时候,当我断网了,或者网络出了莫名其妙的问题时,我总是第一个输入它的网址.它不仅仅是一个搜索引擎.它还是我检验网络的唯一标准(手动滑稽). CSS中的after和be ...
- Django 04 模板标签(if、for、url、with、autoeacape、模板继承于引用、静态文件加载)
Django 04 模板标签(if.for.url.with.autoeacape.模板继承于引用.静态文件加载) 一.if.for.url.with.autoescape urlpatterns = ...
- angularJs1.x 版本中 uib-tabset 如何默认激活不同的标签页
<uib-tabset> 默认有个active属性,根据官方文档,active的默认值是0,也就是说,默认显示索引为0的标签页,可以通过修改这个值来默认显示不同的索引的标签页. 示例: ...
- 学霸笔记系列 - Python Selenium项目实战(一)—— 怎么去验证一个按钮是启用的(可点击)?
Q: 使用 Python Selenium WebDriver 怎么去验证一个按钮是启用的(可点击)? A:Selenium WebDriver API 里面给出了解决方法is_enabled() 使 ...