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.onresize 多次触发的解决方法
Nov 08 Javascript
js判断IE浏览器版本过低示例代码
Nov 22 Javascript
Dojo Javascript 编程规范 规范自己的JavaScript书写
Oct 26 Javascript
require.js的用法详解
Oct 20 Javascript
JS提示:Uncaught SyntaxError: Unexpected token ILLEGAL错误的解决方法
Aug 19 Javascript
jQuery电话号码验证实例
Jan 05 Javascript
seajs实现强制刷新本地缓存的方法分析
Oct 16 Javascript
JS+Canvas绘制动态时钟效果
Nov 10 Javascript
react 创建单例组件的方法
Apr 26 Javascript
详解vue-loader在项目中是如何配置的
Jun 04 Javascript
layer ui插件显示tips时,修改字体颜色的实现方法
Sep 11 Javascript
Vue的过滤器你真了解吗
Feb 24 Vue.js
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实现表单多按钮提交action的处理方法
2015/10/24 PHP
PHP 文件上传后端处理实用技巧方法
2017/01/06 PHP
利用div+jquery自定义滚动条样式的2种方法
2013/07/18 Javascript
Jquery读取URL参数小例子
2013/08/30 Javascript
类似php的js数组的in_array函数自定义方法
2013/12/27 Javascript
js实现省市联动效果的简单实例
2014/02/10 Javascript
node.js中使用socket.io的方法
2014/12/15 Javascript
深入理解JavaScript系列(22):S.O.L.I.D五大原则之依赖倒置原则DIP详解
2015/03/05 Javascript
纯javascript实现简单下拉刷新功能
2015/03/13 Javascript
JavaScript随机生成信用卡卡号的方法
2015/04/07 Javascript
javascript url几种编码方式详解
2016/06/06 Javascript
简单实现Vue的observer和watcher
2016/12/21 Javascript
浅谈es6中export和export default的作用及区别
2018/02/07 Javascript
Vue结合后台导入导出Excel问题详解
2019/02/19 Javascript
Vue 组件修改根实例的数据的方法
2019/04/02 Javascript
vue设计一个倒计时秒杀的组件详解
2019/04/06 Javascript
vue单文件组件无法获取$refs的问题
2020/06/24 Javascript
Vue实现返回顶部按钮实例代码
2020/10/21 Javascript
深入理解python多进程编程
2016/06/12 Python
python 3.6 tkinter+urllib+json实现火车车次信息查询功能
2017/12/20 Python
python中redis查看剩余过期时间及用正则通配符批量删除key的方法
2018/07/30 Python
python读取文件名并改名字的实例
2019/01/07 Python
详解Python中pandas的安装操作说明(傻瓜版)
2019/04/08 Python
详解python中index()、find()方法
2019/08/29 Python
python中web框架的自定义创建
2019/09/08 Python
Python FtpLib模块应用操作详解
2019/12/12 Python
python利用 keyboard 库记录键盘事件
2020/10/16 Python
如何在 Matplotlib 中更改绘图背景的实现
2020/11/26 Python
英国高档百货连锁店:John Lewis
2017/11/20 全球购物
OLEDBConnection和SQLConnection有什么区别
2013/05/31 面试题
音乐学个人的自荐书范文
2013/11/26 职场文书
《天安门广场》教学反思
2014/04/23 职场文书
会议欢迎词
2015/01/23 职场文书
2015年行政人事工作总结
2015/05/21 职场文书
python 实现德洛内三角剖分的操作
2021/04/22 Python
使用Docker容器部署rocketmq单机的全过程
2022/04/03 Servers