javascript高级程序设计第二版第十二章事件要点总结(常用的跨浏览器检测方法)


Posted in Javascript onAugust 22, 2012
var EventUtil={ //跨浏览器处理程序---创建方法 
addHandler:function(element,type,handler){ 
if(element.addEventListener){ 
element.addEventListneter(type,handler,false); 
}else if(element.attachEvent){ 
element.attachEvent("on"+type,handler); 
}else{ 
element["on"+type]=handler; 
} 
} 
removeHandler:function(element,type,handler){ //跨浏览器处理程序---删除方法 
if(element.removeEventListener){ 
element.removeEventListneter(type,handler,false); 
}else if(element.detachEvent){ 
element.detachEvent("on"+type,handler); 
}else{ 
element["on"+type]=handler; 
} 
} 
getEvent:function(event){ //跨浏览器事件对象---返回event对象的引用 
return event?event:window.event; 
} 
getTarget:function(event){ //跨浏览器事件对象---返回事件的目标 
return event.target||event.srcElement; 
} 
preventDefault:function(event){ //跨浏览器事件对象---取消默认事件 
if(event.preventDefault){ 
event.preventDefault(); 
}else{ 
event.returnValue=false; 
} 
} 
stoppropagation:function(event){ //跨浏览器事件对象---阻止事件流 
if(event.stoppropagation){ 
event.stoppropagation(); 
}else{ 
event.canceBubble=false; 
} 
} 
getRelatedTarget:function(event){ //跨浏览器获取相关元素 
if(event.relatedTarget){ 
return event.relatedTarget; 
}else if(event.toElement){ 
return envent.toElement; 
}else if(event.fromElement){ 
return event.fromElement; 
}else{ 
return null; 
} 
} 
getButton:function(event){ //鼠标事件的button属性检测 
if(document.implementation.hasFeature("MouseEvent","2.0")){ 
return event.button; 
}else{ 
switch(event.button){ 
case 0: 
case 1: 
case 3: 
case 5: 
case 7: 
return 0; 
case 2: 
case 6: 
return 2 
case 4: 
return 1 
} 
} 
} 
getCharCode:function(event){ //跨浏览器字符编码---charCode属性检测 
if(typeof event,charCode=="number"){ 
return event.charCode; 
}else{ 
return event.keyCode; 
} 
} 
}

事件委托:事件处理程序过多的解决方案,减少内存并且提高性能;
模拟事件:这个比较复杂,要慢慢研究;
Javascript 相关文章推荐
window.open的功能全解析
Oct 10 Javascript
js获取元素在浏览器中的绝对位置
Jul 24 Javascript
实现变速回到顶部的JavaScript代码
May 09 Javascript
javascript解决innerText浏览器兼容问题思路代码
May 17 Javascript
angular.js指令中transclude选项及ng-transclude指令详解
May 24 Javascript
详解Angular2表单-模板驱动的表单(Template-Driven Forms)
Aug 04 Javascript
JavaScript中使用Async实现异步控制
Aug 15 Javascript
简述Angular 5 快速入门
Nov 04 Javascript
jQuery实现定时隐藏对话框的方法分析
Feb 12 jQuery
JavaScript实现创建自定义对象的常用方式总结
Jul 09 Javascript
node后端服务保活的实现
Nov 10 Javascript
vue接口请求加密实例
Aug 11 Javascript
js选取多个或单个元素的实现代码(用class)
Aug 22 #Javascript
javascript动态加载三
Aug 22 #Javascript
javascript动态加载二
Aug 22 #Javascript
javascript动态加载实现方法一
Aug 22 #Javascript
原生js写的放大镜效果
Aug 22 #Javascript
window.open不被拦截的实现代码
Aug 22 #Javascript
EASYUI TREEGRID异步加载数据实现方法
Aug 22 #Javascript
You might like
在PHP中使用Sockets 从Usenet中获取文件
2008/01/10 PHP
PHP include任意文件或URL介绍
2014/04/29 PHP
yii框架结合charjs统计上一年与当前年数据的方法示例
2020/04/04 PHP
一款JavaScript压缩工具:X2JSCompactor
2007/06/13 Javascript
监控 url fragment变化的js代码
2010/04/19 Javascript
最短的IE判断var ie=!-[1,]分析
2014/05/28 Javascript
JavaScript插件化开发教程(六)
2015/02/01 Javascript
JS实现文字掉落效果的方法
2015/05/06 Javascript
JavaScript基础篇(6)之函数表达式闭包
2015/12/11 Javascript
jQuery实现图片加载完成后改变图片大小的方法
2016/03/29 Javascript
jQuery的内容过滤选择器学习教程
2016/04/18 Javascript
js 获取范围内的随机数实例代码
2016/08/02 Javascript
vuex2中使用mapGetters/mapActions报错的解决方法
2018/10/20 Javascript
Vue动态路由缓存不相互影响的解决办法
2019/02/19 Javascript
Vue中this.$nextTick的作用及用法
2020/02/04 Javascript
JS如何在数组指定位置插入元素
2020/03/10 Javascript
python正则表达式爬取猫眼电影top100
2018/02/24 Python
浅谈python多进程共享变量Value的使用tips
2019/07/16 Python
python2使用bs4爬取腾讯社招过程解析
2019/08/14 Python
详解Pycharm与anaconda安装配置指南
2020/08/25 Python
关于django python manage.py startapp 应用名出错异常原因解析
2020/12/15 Python
为什么需要版本控制
2016/10/28 面试题
应届生会计求职信
2013/11/11 职场文书
会计系个人求职信范文分享
2013/12/20 职场文书
项目合作意向书范本
2014/04/01 职场文书
奥巴马竞选演讲稿
2014/05/15 职场文书
商场开业庆典策划方案
2014/06/02 职场文书
私营公司诉讼代理委托书范本
2014/09/13 职场文书
六一领导慰问欢迎词
2015/01/26 职场文书
物业项目经理岗位职责
2015/04/01 职场文书
2016年五一劳动节专题校园广播稿
2015/12/17 职场文书
英语版自我评价,35句话轻松搞定
2019/10/08 职场文书
python3 sqlite3限制条件查询的操作
2021/04/07 Python
React实现动效弹窗组件
2021/06/21 Javascript
Linux、ubuntu系统下查看显卡型号、显卡信息详解
2022/04/07 Servers
高通2023 年将发布高性能PC处理器
2022/04/29 数码科技