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 相关文章推荐
javascript判断用户浏览器插件安装情况的代码
Jan 01 Javascript
jQuery移动和复制dom节点实用DOM操作案例
Dec 17 Javascript
js Math 对象的方法
Sep 01 Javascript
JavaScript中创建对象和继承示例解读
Feb 12 Javascript
jquery选择符快速提取web表单数据示例
Mar 27 Javascript
Easyui的组合框的取值与赋值
Oct 28 Javascript
微信小程序中实现一对多发消息详解及实例代码
Feb 14 Javascript
JS回调函数基本定义与用法实例分析
May 24 Javascript
微信小程序出现wx.navigateTo页面不跳转问题的解决方法
Dec 26 Javascript
利用jquery和BootStrap实现动态滚动条效果
Dec 03 jQuery
Next.js实现react服务器端渲染的方法示例
Jan 06 Javascript
iview实现动态表单和自定义验证时间段重叠
Jan 10 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 IPV6正则表达式验证代码
2010/02/16 PHP
php数组函数序列之array_unshift() 在数组开头插入一个或多个元素
2011/11/07 PHP
浅析php中抽象类和接口的概念以及区别
2013/06/27 PHP
奉献出一个封装的curl函数 便于调用(抓数据专用)
2013/07/22 PHP
ThinkPHP中的关联模型注意点
2014/06/16 PHP
YII2 实现多语言配置的方法分享
2017/01/11 PHP
PHP实现随机数字、字母的验证码功能
2018/08/01 PHP
php session_decode函数用法讲解
2019/05/26 PHP
Thinkphp 框架扩展之Widget扩展实现方法分析
2020/04/23 PHP
Nigma vs Liquid BO3 第二场2.13
2021/03/10 DOTA
JavaScript DOM学习第八章 表单错误提示
2010/02/19 Javascript
jquery 图片截取工具jquery.imagecropper.js
2010/04/09 Javascript
javascript实现div的拖动并调整大小类似qq空间个性编辑模块
2012/12/12 Javascript
js鼠标滑轮滚动事件绑定的简单实例(兼容主流浏览器)
2014/01/14 Javascript
jquery简单图片切换显示效果实现方法
2015/01/14 Javascript
JS实现文字链接感应鼠标淡入淡出改变颜色的方法
2015/02/26 Javascript
JavaScript实现分页效果
2017/03/28 Javascript
jquery实现简单实用的轮播器
2017/05/23 jQuery
JS实现图片放大镜插件详解
2017/11/06 Javascript
超出JavaScript安全整数限制的数字计算BigInt详解
2018/06/24 Javascript
vue-cli项目配置多环境的详细操作过程
2018/10/30 Javascript
JavaScript实现世界各地时间显示
2020/09/07 Javascript
Nuxt.js nuxt-link与router-link的区别说明
2020/11/06 Javascript
[07:09]DOTA2-DPC中国联赛 正赛 Ehome vs Elephant 选手采访
2021/03/11 DOTA
Python算法应用实战之队列详解
2017/02/04 Python
Python基于whois模块简单识别网站域名及所有者的方法
2018/04/23 Python
pyqt5 使用cv2 显示图片,摄像头的实例
2019/06/27 Python
pycharm安装及如何导入numpy
2020/04/03 Python
英国美发和美容产品商城:HQhair
2019/02/08 全球购物
static全局变量与普通的全局变量有什么区别?static局部变量和普通局部变量有什么区别?static函数与普通函数有什么区别?
2015/02/22 面试题
Sql面试题
2013/03/20 面试题
运动会广播稿50字
2014/01/26 职场文书
2015年小学数学教研组工作总结
2015/05/21 职场文书
大队委员竞选稿
2015/11/20 职场文书
工作汇报材料难写?方法都在这里了!
2019/07/01 职场文书
Golang中channel的原理解读(推荐)
2021/10/16 Golang