javaScript事件机制兼容【详细整理】


Posted in Javascript onJuly 23, 2016

【添加事件机制】  addEventListener  和  attachEvent

[W3C]

addEventListener('click' , function(){alert('Hello World')} ,false )  //W3C规范添加事件(IE8及以上不兼容);  第一个参数为事件类型 ,第二个为事件程序 ,第三个 false为事件冒泡,true为事件捕获

[IE]

attachEvent('onclick',function(){alert('Hello World')})  //IE添加事件;  第一个参数为事件类型(需要加on) ; 第二个为事件程序 ; 因为IE只支持事件冒泡,所以只有两个参数

[跨浏览器兼容]

function insertEvent(obj,Event,fun){

if(obj.addEvenListener){

 
 addEventLitener(Event,fun,false)


}else if(obj.attach){



attachEvent('on'+Event,fun)


}


}

【删除事件机制】 removeEventListener  detachEvent

[W3C] removeEventListener

removeEventListener()    //利用addEventListener新增的事件只能通过removeEventListener来删除;

[注意] //以下这种删除事件方式是错误的,因为事件程序必须不能是一个匿名函数

addEventListener('click' , function(){alert('Hello World')} ,false )

removeEventListener('click',function(){alert('Hello World')},false) 

 [解决]

addEventListener('click' , box ,false );

removeEventListener('click',box,false) ;

function box(){

alert('Hello World');

}

[跨浏览器兼容]

function deleteEvent(obj,Event,fun){

if(obj.removeEventListener){



removeEventListener(Event,fun,false);


}else if(obj.detachEvent){



detachEvent('on'+Event,fun)


 }

}

 【阻止特定事件的默认行为】

[preventDefault  和returnValue]

[W3C] preventDefault

[IE]  reutrnValue

[跨浏览器兼容]

function(event){

event=event || window.event;


if(event.preventDefault){



event.preventDefault()


}else{


 event.returnValue=false;


}

}

【获取目标对象】

[target 和 srcElement]

function(event){

event=event || window.event;


if(event.target){



return event.target;


}else if(event.srcElement){



return event.srcElement;


}

 


}

以上这篇javaScript事件机制兼容【详细整理】就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
从阿里妈妈发现的几个不错的表单验证函数
Sep 21 Javascript
网易JS面试题与Javascript词法作用域说明
Nov 09 Javascript
浅析return false的正确使用
Nov 04 Javascript
jquery中each遍历对象和数组示例
Aug 05 Javascript
jquery判断复选框是否选中进行答题提示特效
Dec 10 Javascript
jQuery实用小技巧_输入框文字获取和失去焦点的简单实例
Aug 25 Javascript
Angular.js实现多个checkbox只能选择一个的方法示例
Feb 24 Javascript
js实现导航吸顶效果
Feb 24 Javascript
很棒的vue弹窗组件
May 24 Javascript
vue.js实现格式化时间并每秒更新显示功能示例
Jul 07 Javascript
VUE脚手架的下载和配置步骤详解
Apr 01 Javascript
如何获取vue单文件自身源码路径
May 06 Javascript
基于bootstrap实现广告轮播带图片和文字效果
Jul 22 #Javascript
基于Bootstrap实现的下拉菜单手机端不能选择菜单项的原因附解决办法
Jul 22 #Javascript
基于Bootstrap实现下拉菜单项和表单导航条(两个菜单项,一个下拉菜单和登录表单导航条)
Jul 22 #Javascript
JavaScript中的Reflect对象详解(ES6新特性)
Jul 22 #Javascript
JavaScript结合Bootstrap仿微信后台多图文界面管理
Jul 22 #Javascript
详细探究ES6之Proxy代理
Jul 22 #Javascript
jquery常用的12个小功能
Jul 22 #Javascript
You might like
php设计模式 Visitor 访问者模式
2011/06/28 PHP
PHP开发者常犯的10个MySQL错误更正剖析
2012/01/30 PHP
PHP Cookie的使用教程详解
2013/06/03 PHP
PHP根据IP判断地区名信息的示例代码
2014/03/03 PHP
php获取网页中图片、DIV内容的简单方法
2014/06/19 PHP
php实现paypal 授权登录
2015/05/28 PHP
图片按比例缩放函数
2006/06/26 Javascript
利用javascript解决图片缩放及其优化的代码
2012/05/23 Javascript
为EasyUI的Tab标签添加右键菜单的方法
2012/07/14 Javascript
js动态调用css属性的小规律及实例说明
2013/12/28 Javascript
Node.js中使用事件发射器模式实现事件绑定详解
2014/08/15 Javascript
avalon js实现仿微博拖动图片排序
2015/08/14 Javascript
JS字符串的切分用法实例
2016/02/22 Javascript
使用JavaScript实现ajax的实例代码
2016/05/11 Javascript
[Bootstrap-插件使用]Jcrop+fileinput组合实现头像上传功能实例代码
2016/12/20 Javascript
Bootstrap 模态框多次显示后台提交多次BUG的解决方法
2017/12/26 Javascript
解决vue处理axios post请求传参的问题
2018/03/05 Javascript
vue中v-cloak解决刷新或者加载出现闪烁问题(显示变量)
2018/04/20 Javascript
jQuery+ajax实现动态添加表格tr td功能示例
2018/04/23 jQuery
vue v-for 使用问题整理小结
2019/08/04 Javascript
详解vue beforeRouteEnter 异步获取数据给实例问题
2019/08/09 Javascript
Selenium执行Javascript脚本参数及返回值过程详解
2020/04/01 Javascript
[41:56]Spirit vs Liquid Supermajor小组赛A组 BO3 第一场 6.2
2018/06/03 DOTA
Python爬虫常用小技巧之设置代理IP
2018/09/13 Python
Python上下文管理器全实例详解
2019/11/12 Python
pytorch forward两个参数实例
2020/01/17 Python
Python中socket网络通信是干嘛的
2020/05/27 Python
如何教少儿学习Python编程
2020/07/10 Python
解决python对齐错误的方法
2020/07/16 Python
Python性能测试工具Locust安装及使用
2020/12/01 Python
python爬虫搭配起Bilibili唧唧的流程分析
2020/12/01 Python
突袭HTML5之Javascript API扩展3—本地存储全新体验
2013/01/31 HTML / CSS
世界第一曲奇连锁店:Mrs. Fields Cookies
2017/02/04 全球购物
2013的个人自我评价
2013/12/26 职场文书
党支部换届选举方案
2014/05/08 职场文书
倡议书的写法
2014/08/30 职场文书