javascript获取事件源

简介:

JavaScript获取事件源

Js代码   收藏代码
  1. var node = evt.currentTarget || evt.srcElement;  
  2. var obj = event.srcElement ? event.srcElement : event.target;  

 

加强版:

Js代码   收藏代码
  1. var eventTarget = event.srcElement || event.target || event.toElement|| event.currentTarget  

 范例:

Js代码   收藏代码
  1. var event = window.event || ev;//兼容ie7 8  
  2.             cleanUpDefaultEvent(event);//清除默认事件  
  3.             var target2 = event.srcElement || event.target || event.toElement;  
  4.             var position = {x: 0, y: 0};  
  5.             var imgObj = target2;  

 

Js代码   收藏代码
  1. getRelativePosition = helpers.getRelativePosition = function(evt){  
  2.             var mouseX, mouseY;  
  3.             var e = evt.originalEvent || evt,  
  4.                 canvas = evt.currentTarget || evt.srcElement||evt.target||evt.toElement,  
  5.                 boundingRect = canvas.getBoundingClientRect();  
  6.   
  7.             if (e.touches){  
  8.                 mouseX = e.touches[0].clientX - boundingRect.left;  
  9.                 mouseY = e.touches[0].clientY - boundingRect.top;  
  10.   
  11.             }  
  12.             else{  
  13.                 mouseX = e.clientX - boundingRect.left;  
  14.                 mouseY = e.clientY - boundingRect.top;  
  15.             }  
  16.   
  17.             return {  
  18.                 x : mouseX,  
  19.                 y : mouseY  
  20.             };  
  21.   
  22.         }  

  

封装成为函数:

Js代码   收藏代码
  1. /*** 
  2.  * 获取事件源 
  3.  * @param evt 
  4.  * @returns {*|Object} 
  5.  */  
  6. getSrcElement = function (evt) {  
  7.     var event = window.event || evt;//兼容ie7 8  
  8.     var eventTarget = event.srcElement || event.target || event.toElement || event.currentTarget;  
  9.     return eventTarget;  
  10. };  

 

相关文章
|
3月前
|
JavaScript 前端开发
JavaScript中的原型 保姆级文章一文搞懂
本文详细解析了JavaScript中的原型概念,从构造函数、原型对象、`__proto__`属性、`constructor`属性到原型链,层层递进地解释了JavaScript如何通过原型实现继承机制。适合初学者深入理解JS面向对象编程的核心原理。
49 1
JavaScript中的原型 保姆级文章一文搞懂
|
7月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的客户关系管理系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的客户关系管理系统附带文章源码部署视频讲解等
138 2
|
3月前
JS+CSS3文章内容背景黑白切换源码
JS+CSS3文章内容背景黑白切换源码是一款基于JS+CSS3制作的简单网页文章文字内容背景颜色黑白切换效果。
34 0
|
7月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的小区物流配送系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的小区物流配送系统附带文章源码部署视频讲解等
196 4
|
7月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的宠物援助平台附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的宠物援助平台附带文章源码部署视频讲解等
107 4
|
7月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的宠物交易平台附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的宠物交易平台附带文章源码部署视频讲解等
98 4
|
7月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的大学生入伍人员管理系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的大学生入伍人员管理系统附带文章源码部署视频讲解等
113 4
|
7月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp宿舍管理系统的附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp宿舍管理系统的附带文章源码部署视频讲解等
108 3
|
7月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的家政平台附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的家政平台附带文章源码部署视频讲解等
89 3

热门文章

最新文章

  • 1
    当面试官再问我JS闭包时,我能答出来的都在这里了。
    40
  • 2
    【02】仿站技术之python技术,看完学会再也不用去购买收费工具了-本次找了小影-感觉页面很好看-本次是爬取vue需要用到Puppeteer库用node.js扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
    27
  • 3
    Node.js 中实现多任务下载的并发控制策略
    32
  • 4
    【2025优雅草开源计划进行中01】-针对web前端开发初学者使用-优雅草科技官网-纯静态页面html+css+JavaScript可直接下载使用-开源-首页为优雅草吴银满工程师原创-优雅草卓伊凡发布
    26
  • 5
    【JavaScript】深入理解 let、var 和 const
    49
  • 6
    【04】Java+若依+vue.js技术栈实现钱包积分管理系统项目-若依框架二次开发准备工作-以及建立初步后端目录菜单列-优雅草卓伊凡商业项目实战
    47
  • 7
    【03】Java+若依+vue.js技术栈实现钱包积分管理系统项目-若依框架搭建-服务端-后台管理-整体搭建-优雅草卓伊凡商业项目实战
    56
  • 8
    【02】Java+若依+vue.js技术栈实现钱包积分管理系统项目-商业级电玩城积分系统商业项目实战-ui设计图figmaUI设计准备-figma汉化插件-mysql数据库设计-优雅草卓伊凡商业项目实战
    57
  • 9
    如何通过pm2以cluster模式多进程部署next.js(包括docker下的部署)
    72
  • 10
    【01】Java+若依+vue.js技术栈实现钱包积分管理系统项目-商业级电玩城积分系统商业项目实战-需求改为思维导图-设计数据库-确定基础架构和设计-优雅草卓伊凡商业项目实战
    55