//事件

var EventUtil = {
//添加事件
addHandler:function (element, type, handler) { //element:DOM对象,type:事件类型,handler:事件函数
if (element.addEventListener) {
//是否存在DOM2级方法
element.addEventListener(type, handler, false);
} else if (element.attachEvent) {
//IE方法,不过IE中的作用域是全局性的
element.attachEvent("on" + type, handler);
} else {
//DOM0级方法
element["on" + type] = handler;
}
},
//获取DOM event对象或者IE event对象
getEvent:function (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;
}
},
//移除事件
removeHandler:function (element, type, handler) {
if (element.removeEventListener) {
element.removeEventListener(type, handler, false);
} else if (element.detachEvent) {
element.detachEvent("on" + type, handler);
} else {
element["on" + type] = null;
}
},
//阻止事件冒泡
stopPropagation:function (event) {
if (event.stopPropagation) {
event.stopPropagation();
} else {
event.cancelBubble = true;
}
},
//mouseout,mouseover相关元素
getRelatedTarget:function (event) {
if (event.relatedTarget) {
//DOM的event对象的relatedTarget
return event.relatedTarget;
} else if (event.toElement) {
//IE mouseout事件触发时,toElement代表相关元素
return event.toElement;
} else if (event.fromElement) {
//IE mouseover事件触发时,fromElement代表相关元素
return event.fromElement;
} else {
return null;
}
},
//鼠标按钮
getButton:function (event) {
//因为DOM版与iE版同名,需通过hasFeature()方法检测
if (document.implementation.hasFeature("MouseEvents", "2.0")) {
return event.button;
} else {
//IE event.button
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) {
if (typeof event.charCode == "number") {
//非IE在keypress事件时charCode代表那个键的ASCII值
//在不支持此属性的浏览器中,值为undefined
return event.charCode;
} else {
// for IE
return event.keyCode;
}
},
//获取鼠标滚轮数值判断方向
//向上滚动数值为正,是120的倍数
//向下滚动数值为负
getWheelDelta:function (event) {
if (event.wheelDelta) {
//IE,opera 9.5以后,chrome,safari支持事件类型mousewheel
return (client.engine.opera && client.engine.opera < 9.5 ? -event.wheelDelta : event.wheelDelta);
} else {
//Firefox支持事件类型DOMMouseScroll
return -event.detail * 40;
}
},
//获取剪贴板数据
/** etc:
* EventUtil.addHandler(textbox,"paste",function(event){
* event.EventUtil.getEvent(event);
* var text=EventUtil.getClipboardText(event);
* if(!/^\d*$/.test(text)){
* EventUtil.preventDefault(event);
* });
* 只有数值才会被粘贴到文本框
*/
getClipboardText:function (event) {
var clipboardData = (event.clipboardData || window.clipboardData); //for Safari,Chrome or IE
return clipboardData.getData("text");
},

//设置剪贴板数据
/**
* etc:
* EventUtil.addHandler(textbox,"copy",function(event){
* event.EventUtil.getEvent(event);
* EventUtil.preventDefault(event);
* EventUtil.setClipboardText(event,"Hello world");
* });
* @param event
* @param value
* @return {*}
* 不会将文本框中的文本复制到剪贴板
*/
setClipboardText:function (event, value) {
if (event.clipboardData) {
//for Chrome.Safari
return event.clipboardData.setData("text/plain", value);
} else {
//for IE
return window.clipboardData.setData("text", value);
}
}
};

转载于:https://www.cnblogs.com/webFrontDev/archive/2012/11/04/2753483.html

js高级程序设计之跨浏览器事件处理相关推荐

  1. js高级程序设计第四部分

    js高级程序设计:BOM.客户端检测 BOM window对象 在浏览器中,window 对象有双重角色,它既是通过 JavaScript 访问浏览器窗口的一个接口,又是 ECMAScript 规定的 ...

  2. 《Ext JS 高级程序设计》的目录与样张

    第一部分 Ext Core 第1 章 Ext Core 重要概念 ············· 2 1.1 Ext.Element······························· 2 1. ...

  3. Ext JS高级程序设计

    Ext JS高级程序设计 图书详细情况查看: http://www.china-pub.com/193076 市场价 :¥59.00 会员价 : ¥44.25(75折) [作 者]黄灯桥;徐会生 [同 ...

  4. JS高级程序设计【红宝书】学习笔记——数据类型

    目录 数据类型 Number类型 1.值的范围 2.NaN 3.数值转换 String类型 1.字符字面量(详见JS高级程序设计P63 2.转换为字符串 Symbol类型 Object类型 objec ...

  5. 读js高级程序设计中有感

    我现在都到js高级程序设计最难的章节,第六章,对象,虽然有人推荐不用全部读完,但我还是完整的读一遍吧,一遍可以敲代码一边看书理解加百度,我认为这种方式很好,可以加深理解增强印象,这是我觉得这本书比JS ...

  6. Js高级程序设计第三版学习(十二章)

                                  Js高级程序设计第三版学习(十二章) 第十二章 DOM2和DOM3   1.样式: 访问样式属性 任何支持style特性的HTML元素都有一 ...

  7. JS高级程序设计——阅读笔记四

    JS高级程序设计--阅读笔记四 第六章 集合引用类型 6.1 Object 6.2 Array 6.2.1 创建数组 from()函数 6.2.2 数组空位 6.2.3 数组索引 6.2.4 检测数组 ...

  8. JS高级程序设计拾遗

    <JavaScript高级程序设计(第三版)>反反复复看了好多遍了,这次复习作为2017年上半年的最后一次,将所有模糊的.记不清的地方记录下来,方便以后巩固. 0. <script& ...

  9. js高级程序设计(一) —— js简介

    学习<JavaScript高级程序设计>的知识总结,以及对部分内容的扩展~ 1.一个完整的js实现的三个部分 核心(ECMAScript) 文档对象模型(DOM) 浏览器对象模型(BOM) ...

最新文章

  1. 微信小程序 html css xml,微信小程序 使用towxml解析html流程及踩坑记录
  2. Python:更改默认启动的python程序及其对应的安装包路径(更改pip的默认安装包的路径)图文教程之详细攻略
  3. 北邮OJ 255. 奇偶求和-软件14 2014年北京邮电大学软件工程学院研究生复试
  4. python学习实例(5)
  5. mysql的where字句调优_mysql中select和where子句优化的总结
  6. 一站式实时数仓开发:当FLINK SQL遇见ULTRON
  7. 运行VINS-mono:/home/tony-ws1/output/pose_graph/ not exists, trying to create it /home/tony-ws1/ou错误解决
  8. 46. Permutations 1
  9. 概率论-随机事件及其概率
  10. mysql出错代码表
  11. Swift3.0朝圣之路-Then协议库-绝妙的初始化方式
  12. 基于linux的进程调度模拟程序,2011180021_Linux操作系统_课程设计报告_基于Linux的进程调度模拟程序...
  13. wps画 ui 原型图
  14. 用正则表达式清除各类符号
  15. 共享远程计算机文件夹,怎么远程访问共享文件夹
  16. 资源 就是Tianmao项目里小部分备用 测试 的数据以及图片
  17. iOS小技能:常用预处理指令(移除程序中的identifier、发布模式关闭NSLog、导出和隐藏符号)
  18. 树莓派4B刷openwrt软路由系统,树莓派做有线路由器的扩展实现各种自定义操作
  19. PCB原理图绘制(种草立创eda)
  20. 国内外常见DNS汇总 (更新:201904)

热门文章

  1. php错误提示如何查询,php-如何显示我的MySQLi查询错误?
  2. 前端Vue学习之路(一)-初识Vue
  3. Redis 使用技巧
  4. pytorch的backward
  5. LeetCode简单题之交替位二进制数
  6. 用NumPy genfromtxt导入数据
  7. Auto ML自动特征工程
  8. 自动机器学习(AutoML)
  9. 模型压缩95%:Lite Transformer,MIT韩松等人
  10. GPU—加速数据科学工作流程