框架中的HTML DOM Event 对象
js中的this上下文会因事件而转换成html dom对象。
所以就有这样获取当前触发事件的dom对象:
window.event.srcElement || window.event.target;
var e = window.event || e;
var srcElement = e.srcElement || e.target;
var id=srcElement.id.split("_")[];//不采用闭包的话就只能手动加id了
jquery的话,就$('this')
但是在MVC的工程内部,比如事件对象是evt:
evt.srcElement (IE支持,对于生成事件的 Window 对象、Document 对象或 Element 对象的引用。)
evt.target (返回触发此事件的元素)
evt.currentTarget(返回其事件监听器触发该事件的元素,在捕获和起泡阶段,该属性是非常有用的,因为在这两个节点,它不同于 target 属性。)
evt.bubbles(指示是否起泡事件类型)
有趣的是,在appframework中如果采用的是on方法,事件委托给父级节点,那么srcElement,target,currentTarget全都指向了该父节点,而不会指向实际触发事件的子元素。
照理说,target应该是指向事件的目标节点,应该返回真正触发事件的子元素。
一般在事件绑定的时候指定的回调函数里面就可以接收这个e参数,
比如:
itu.event.on($el.find(me.PIC), "tap", me.picTrigger, me);
picTrigger : function(e){
var me = this,$el = me.$element;
var id = $(event.target).data("id");
$el.trigger("reviewList",id);
}
这样就可以获取PIC元素的自定义属性data-id值
框架中的HTML DOM Event 对象的更多相关文章
- 浏览器端-W3School-JavaScript-HTML DOM:HTML DOM Event 对象
ylbtech-浏览器端-W3School-JavaScript-HTML DOM:HTML DOM Event 对象 1.返回顶部 1. HTML DOM Event 对象 实例 哪个鼠标按钮被点击 ...
- HTML DOM Event对象
我们通常把HTML DOM Event对象叫做Event事件 事件驱动模型 事件源:(触发事件的元素)事件源对象是指event对象 其封装了与事件相关的详细信息. 当事件发生时,只能在事件函数内部访问 ...
- laravel框架中Job和事件event的解析
本篇文章给大家带来的内容是关于laravel框架中Job和事件event的解析,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助. 在做项目的时候,一直对Job和Event有个疑惑.感觉两 ...
- html中事件处理中的this和event对象
在用js编写页面事件处理代码时,会经常涉及到this和event对象,但有时在采用不同的事件处理,尤其是在与自定义的对象关联时,这些对象的指向变的有些复杂. 本文来详细介绍下各种场景下 这些对象 真正 ...
- Dom EVENT对象
Event 对象代表事件的状态,比如事件在其中发生的元素.键盘按键的状态.鼠标的位置.鼠标按钮的状态. 事件通常与函数结合使用,函数不会在事件发生前被执行! 一:测试按键 function which ...
- HTML DOM Event 对象
var event;if (document.createEvent){event = document.createEvent("HTMLEvents");event.initE ...
- JavaScript学习笔记(11)——HTML DOM Event对象
w3cshool:时间参考手册:http://www.w3school.com.cn/jsref/dom_obj_event.asp
- DOM中Event 对象如何使用
DOM中Event 对象如何使用 一.总结 一句话总结: 1.将event作为参数传递进来,然后就可以调用event对象的各种属性和方法了. <body onmousedown="wh ...
- vue中如何使用event对象
原文地址 一.event 对象 (一)事件的 event 对象 你说你是搞前端的,那么你肯定就知道事件,知道事件,你就肯定知道 event 对象吧?各种的库.框架多少都有针对 event 对象的处理. ...
随机推荐
- LabVIEW设计模式系列——事件结构中值改变事件
标准:1.将具有值改变事件的控件,放置在其事件结构的值改变页面里.
- Mybatis中实现oracle的批量插入、更新
oracle 实现在Mybatis中批量插入,下面测试可以使用,在批量插入中不能使用insert 标签,只能使用select标签进行批量插入,否则会提示错误 ### Cause: java.sql.S ...
- C语言基础知识小总结(2)
上个总结比较笼统,下面写的稍微详细点吧算是. 一.控制台屏幕打印 1.putchar(); 格式: void putchar(char c); //直接把一个字符输出到屏幕上 2.print ...
- PHP 进制问题
PHP有一些函数提供进制之间的转化问题 在Math函数中有一部分: decbin() - 十进制转换为二进制 bindec() — 二进制转换为十进制 octdec() - 八进制转换为十进制 hex ...
- Apache Hadoop2.0之HDFS均衡操作分析
1 HDFS均衡操作原理 HDFS默认的块的副本存放策略是在发起请求的客户端存放一个副本,如果这个客户端在集群以外,那就选择一个不是太忙,存储不是太满的节点来存放,第二个副本放在与第一个副本相同的机架 ...
- C++的MFC,与C#的.NET
转载:http://blog.sina.com.cn/s/blog_7f5bde5c0101hk5n.html 以下摘自各问答网站.博客论坛: [1]MFC早已过时,现在C++多数是用来编写底层方法而 ...
- python基础知识六
博客园的博文对每篇博文的长度似乎做了限制 面向对象编程, 在程序何种,根据操作数据的函数或语句块来设计程序.这被成为面向过程的编程.还有一种把数据和功能结合起来,用称为对象的东西包裹起来组织组织程序的 ...
- Ubuntu系列Crontab日记记录
修改rsyslog文件,将/etc/rsyslog.d/50-default.conf 文件中的#cron.*前的#删掉 重启rsyslog服务service rsyslog restart 重启cr ...
- 关于项目既要使用ant脚本又要使用maven pom.xml文件的问题
背景:项目使用的是ant脚本打包,但又需要maven去执行sonar代码扫描.所以项目中既有build.xml又有pom.xml build.xml设置的打包后产物文件夹为target,maven运行 ...
- 读书笔记之 - javascript 设计模式 - 命令模式
本章研究的是一种封装方法调用的方式.命令模式与普通函数有所不同.它可以用来对方法调用进行参数化处理和传送,经过这样处理过的方法调用可以在任何需要的时候执行. 它也可以用来消除调用操作的对象和实现操作的 ...