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 相关文章推荐
如何用js控制frame的隐藏或显示的解决办法
Mar 20 Javascript
jQuery实现随意改变div任意属性的名称和值(部分原生js实现)
May 28 Javascript
jQuery动画效果animate和scrollTop结合使用实例
Apr 02 Javascript
自己用jQuery写了一个图片的马赛克消失效果
May 04 Javascript
使用jQuery实现返回顶部
Jan 26 Javascript
js实现页面跳转的五种方法推荐
Mar 10 Javascript
JS判断是否在微信浏览器打开的简单实例(推荐)
Aug 24 Javascript
详解angular中如何监控dom渲染完毕
Jan 03 Javascript
详解vue前后台数据交互vue-resource文档
Jul 19 Javascript
详解vue-cli与webpack结合如何处理静态资源
Sep 19 Javascript
Vue项目全局配置页面缓存之按需读取缓存的实现详解
Aug 01 Javascript
浅谈Vue CLI 3结合Lerna进行UI框架设计
Apr 14 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
解决GD中文乱码问题
2007/02/14 PHP
PHP7.3.10编译安装教程
2019/10/08 PHP
IE php关于强制下载文件的代码
2008/08/23 Javascript
High Performance JavaScript(高性能JavaScript)读书笔记分析
2011/05/05 Javascript
js跑步算法的实现代码
2013/12/04 Javascript
js实现鼠标悬停图片上时滚动文字说明的方法
2015/02/17 Javascript
详解AngularJS Filter(过滤器)用法
2015/12/28 Javascript
json对象转为字符串,当做参数传递时加密解密的实现方法
2016/06/29 Javascript
javascript事件捕获机制【深入分析IE和DOM中的事件模型】
2016/12/15 Javascript
webpack学习笔记之优化缓存、合并、懒加载
2017/08/24 Javascript
详解vue2.0 使用动态组件实现 Tab 标签页切换效果(vue-cli)
2017/08/30 Javascript
Bootstrap 中data-[*] 属性的整理
2018/03/13 Javascript
在微信小程序中渲染HTML内容的方法示例
2018/09/28 Javascript
详解js删除数组中的指定元素
2018/10/31 Javascript
详解基于mpvue微信小程序下载远程图片到本地解决思路
2019/05/16 Javascript
微信小程序 image组件遇到的问题
2019/05/28 Javascript
JavaScript中0、空字符串、'0'是true还是false的知识点分享
2019/09/16 Javascript
CountUp.js数字滚动插件使用方法详解
2019/10/17 Javascript
javascript 数组(list)添加/删除的实现
2020/12/17 Javascript
react-native 实现购物车滑动删除效果的示例代码
2021/01/15 Javascript
itchat-python搭建微信机器人(附示例)
2019/06/11 Python
Python如何用wx模块创建文本编辑器
2020/06/07 Python
Pytorch 使用CNN图像分类的实现
2020/06/16 Python
Canvas实现放大镜效果完整案例分析(附代码)
2020/11/26 HTML / CSS
贝尔帐篷精品店:Bell Tent Boutique
2019/06/12 全球购物
水产养殖学应届生求职信
2013/09/29 职场文书
ktv收银员岗位职责
2013/12/16 职场文书
幼儿园优秀班主任事迹材料
2014/05/14 职场文书
机械工程及自动化专业求职信
2014/09/03 职场文书
司法局群众路线教育实践活动整改措施思想汇报
2014/10/13 职场文书
业务员年终工作总结2015
2015/05/28 职场文书
劳动保障事务所个人工作总结
2015/08/12 职场文书
Python 批量下载阴阳师网站壁纸
2021/05/19 Python
忘记Grafana不要紧2种Grafana重置admin密码方法详细步骤
2022/04/07 Servers
Java 中的 Lambda List 转 Map 的多种方法详解
2022/07/07 Java/Android
Nginx如何获取自定义请求header头和URL参数详解
2022/07/23 Servers