Js事件对象EventUtil
1 var EventUtil = { 2 getEvent: function(event){ //获取事件对象 3 return event ? event : window.event; 4 }, 5 addHandler: function(element, type, handler){ //绑定事件 6 if (element.addEventListener) { 7 element.addEventListener(type, handler, false); 8 } else if (element.attachEvent) { 9 element.attachEvent("on" + type, handler); 10 } else { 11 element["on" + type] = handler; 12 13 } 14 }, 15 removeHandler: function(element, type, handler){ //移除绑定 16 if(element.removeEventListener){ 17 element.removeEventListener(type,handler,false); 18 }else if(element.detachEvent){ 19 element.detachEvent("on"+type,handler,false); 20 }else{ 21 element["on"+type] = null; 22 } 23 }, 24 preventDefault: function(event){ //阻止默认事件 25 if(event.preventDefault){ 26 event.preventDefault(); 27 }else{ 28 event.returnValue = false; 29 } 30 }, 31 stopPropagation: function(event){ //阻止事件冒泡 32 if (event.stopPropagation) { 33 event.stopPropagation(); 34 }else{ 35 event.cancelBubble = true; 36 } 37 }, 38 getRelateTarget: function(event){ //事件相关元素的信息 39 if(event.relatedTarget){ 40 return event.relatedTarget; 41 }else if(event.toElement){ 42 event.toElement; 43 }else if(event.fromElement){ 44 return event.fromElement; 45 }else{ 46 return null; 47 } 48 }, 49 getButton: function(event){ //检测button属性 50 if(document.implementation.hasFeature("MouseEvents","2.0")){ 51 return event.button; 52 }else{ 53 switch(event.button){ 54 case 0: 55 case 1: 56 case 3: 57 case 5: 58 case 7: 59 return 0;//主鼠标按钮 60 case 2: 61 case 6: 62 return 2;//次鼠标按钮 63 case 4: 64 return 1;//鼠标滚轮按钮 65 } 66 } 67 }, 68 getWheelDelta: function(event){//鼠标滚动属性值 69 if(event.wheelDelta){ 70 return (client.engine.opera && client.engine.opera <9.5 ? -event.wheelDelta:event.wheelDelta) 71 }else{ 72 return -event.detail *40; 73 } 74 }, 75 getCharCode: function(event){//获取字符编码 76 if(typeof event.charCode == "number"){ 77 return event.charCode; 78 }else{ 79 return event.keyCode; 80 } 81 }, 82 getCilpboardText: function(event){//获取剪切板内容 83 var cilpboardData = (event.clipboardData || window.clipboardData); 84 return clipboardData.getData("text"); 85 }, 86 setClipboardText:function(event,value){//剪切到剪切板 87 if(event.clipboardData){ 88 return event.clipboardData.setData("text/plain",value); 89 }else if(window.clipboardData){ 90 return window.clipboardData.setData("text",value); 91 } 92 } 93 94 95 }
代码总结于《JavaScript高级程序设计》事件章节。
转载于:https://www.cnblogs.com/Jing-w/p/3922409.html
Js事件对象EventUtil相关推荐
- JS事件对象 (event)
#事件对象 (event) div.onclick = function(event){ console.log(event); let e = event||wind ...
- JS事件对象5--阻止默认事件(鼠标事件)
阻止默认事件的两种方式和兼容方式: <script type="text/javascript">//阻止系统默认事件的两种方式://1.IE:return false ...
- [js] 事件对象 e.target offsetX clientX pageX
鼠标相关事件 e.target 触发事件的标签对象 - e.target.innerText:点击标签的本文内容- e.target.tagName :点击标签的标签名称,标签名称是大写字符- e.t ...
- JS 事件对象 offsetX/Y clientX Y PageX Y
offsetX Y clientX Y PageX Y offsetX/Y,内部不要包含子标签 br换行
- jquery的事件对象
jquery的事件对象就是js事件对象的一个封装,就是做了一个兼容性的封装. screenX和screenY 对应屏幕最左上角的值 clientX和clientY 距离页面左上角的位置(忽略滚动条) ...
- 后处理程序文件大小的变量_【每日一题】(17题)面试官问:JS中事件流,事件处理程序,事件对象的理解?...
关注「松宝写代码」,精选好文,每日一题 作者:saucxs | songEagle 2020,实「鼠」不易 2021,「牛」转乾坤 风劲潮涌当扬帆,任重道远须奋蹄! 一.前言 2020.12.23 立 ...
- 【前端】跨浏览器事件处理程序EventUtil.js个人注释及详解
<javascript高级程序设计>跨浏览器事件处理程序EventUtil.js个人注释 EventUtil.js // 跨浏览器事件处理程序封装 var EventUtil = {// ...
- js进阶课程 12-9 jquery的事件对象event的方法有哪些?
js进阶课程 12-9 jquery的事件对象event的方法有哪些? 一.总结 一句话总结:三组六个,阻止默认事件一组,阻止冒泡一组,阻止冒泡和剩余事件一组. 1.事件的默认动作指什么? 比如点a标 ...
- js中获取事件对象的方法小结
代码如下: var evt = window.event || arguments[0]; 下面分三种添加事件的方式讨论,你也许会看到以前没有看到过的获取方式. 1,第一种添加事件的方式,直接在htm ...
最新文章
- [JS] 题解:提取不重复的整数
- “12306” 是如何支撑百万 QPS 的?
- php中 datalist,html5 datalist标签的用法是什么?这里有datalist标签的用法实例
- r语言 not enough x observations_R基础知识
- 计算机专业 美国 硕士,【美国计算机硕士排名】美国计算机硕士专业怎么样
- shell脚本读取csv_shell script 处理 CSV 文件(Excel)
- OS / Linux / pthread_join() 和 pthread_detach() 函数区别
- left outer join 和 right outer join 和 join 的区别
- 计算机网络教学方式探讨论文,学生老师论文,关于关于高中计算机网络教学效率提升相关参考文献资料-免费论文范文...
- 1.24小时365天不间断服务 --- 服务器及基础设施搭建入门
- python学习资源分享
- Blender mmd 导出FBX模型 和 烘焙动画
- 软件工程项目分析(四) 瀚海星云新版网站 By 郭家华
- 织梦 帝国 php,PHPCMS、织梦DEDECMS、帝国CMS的抉择与比较
- 在网页中打开pdf、word、excel文件
- otherwise 用法
- 【Web技术】1154- 现代 Web 研发体系中的新一代低/零码搭建
- 【教程】记录:python基础爬虫代码(下载妹子福利图片)
- 如何让Java后端日志开发变得优雅
- 会考计算机资料,高中计算机会考选择题资料(全)
热门文章
- 关于TCP三次握手过程
- 以后台服务的形式启动nodejs应用
- java流程控制both_java web面试题
- 迷宫问题 (dfs)
- Deep-Clustering-for-Unsupervised-Learning-of-Visual-Features
- 习题3.3 线性表元素的区间删除 (20 分)
- 习题2.7 弹球距离 (15 分)
- 吴恩达深度学习5.2练习_Sequence Models_Operations on word vectors
- matlab 中一些对数组或矩阵的处理
- 计数排序(Counting sort)