e.target和e.event和event.srcElement
e.target 是目标对象,e.event是目标所发生的事件,event.srcElement捕获当前事件作用的对象
1.
- $(function(){
- $("li:has(ul)").click(function(e){
- if(this==e.target){
- $(this).children().toggle();
- $(this).css("list-style-image",($(this).children().is(":hidden")?"url(plus.gif)":"url(minus.gif)"))
- }
- return false; //避免不必要的事件混绕
- }).css("cursor","pointer").click(); //加载时触发点击事件
- //对于没有子项的菜单,统一设置
- $("li:not(:has(ul))").css({
- "cursor":"default",
- "list-style-image":"none"
- });
- });
具体问题具体分析;当前目标
在event事件中代表点击对象;
loader事件:加载对象;
e只是参数,任意取值;对应即可;
- $(function(){
- $(document).bind("click", function (e) {
- $(e.target).closest("p").css("color","red");
- })
- });
e.target就是事件源,比如点击<input type='button' value='确定' />,那么这个事件源就是这个button。$(e.target)这里的意思是传入事件源,获得button这个对象,相当于document.getElementById()这类方法。
2.
与Flex类似,JavaScript中的事件也同样存在,捕获--触发--冒泡 三个节点.比较常见的情况是,在子DIV触发事件时,如果父DIV也监听同类事件,那么也会一起触发,并向上冒泡
jQuery对事件监听函数,都会默认传递一个参数,一般命名为event或e(非必须,也可以任意命名)
e,event参数中支持下列属性:
event.stopPropagation(); 停止事件冒泡的方法
event.preventDefault(); 组织默认行为--如超链接的跳转
更简单的方式:
return false,对上面两种都起同样的作用
event.type ---事件的类型,如click
event.target---事件的html元素对象
event.relatedTarget() --如在mouseover事件触发时,相关的元素,如另外一个mouseout元素
event.pageX()/event.pageY() --相对于页面的x,y坐标
event.which() --获取与事件相关的键盘或鼠标的按键值
event.metaKey()--判断事件是否包含ctrl按键
event.originalEvent()--指向原始的事件对象
3.event.srcElement 可以捕获当前事件作用的对象,如event.srcElement.tagName可以捕获活动标记名称。
注意获取的标记都以大写表示,如"TD","TR","A"等。
- <script type="text/javascript">
- function tdclick(){
- if(event.srcElement.tagName.toLowerCase()=='td')
- alert("行:"+(event.srcElement.parentNode.rowIndex+1)+"列:"+(event.srcElement.cellIndex+1));
- }
- </script>
IE下,event对象有srcElement属性,但是没有target属性;Firefox下,event对象有target属性,但是没有srcElement属性.但他们的作用是相当的,解决方法:使用obj(obj = event.srcElement ? event.srcElement : event.target;)来代替IE下的event.srcElement或者Firefox下的event.target.
event.srcElement.selectedIndex一般使用在select对像上:
- <input type=button value=GO title="?page=1">
- <script language="JavaScript">
- function f()
- {
- alert('index.asp'+event.srcElement.title)
- location.href='index.asp'+event.srcElement.title
- }
- </script>
- <a title="a测试" >a测试</a>
- <br>
- <table border=1 width="200">
- <tr title="tr测试" ><td>tr</td></tr>
- </table>
- <table border=1 width="200">
- <tr><td title="td测试" >td</td></tr>
- </table>
- <select >
- <option value="1">1</option>
- <option value="2">2</option>
- <option value="3">3</option>
- <option value="4">4</option>
- <option value="5">5</option>
- </select>
event.srcElement的子标签 和父标签:
第一个子标签为
event.srcElement.firstChild
最后个一个是
event.srcElement.lastChild
当然也可以用
event.srcElement.children[i]
event.srcElement.ChildNode[i]
至于event.srcElement.parentElement是指在鼠标所在对象的上一个对象.
e.target和e.event和event.srcElement的更多相关文章
- Event/window.Event属性和方法
type:事件的类型,如onlick中的click:srcElement/target:事件源,就是发生事件的元素:button:声明被按下的鼠标键,整数,1代表左键,2代表右键,4代表中键,如果按下 ...
- js获取键盘按下的键值event.keyCode,event.charCode,event.which的兼容性
js获取键盘按下的键值有event.keyCode,event.charCode和event.which 其中: 谷歌浏览器对event.keyCode,event.charCode和event.wh ...
- event.keyCode|| event.which.的用法
HTML 用户名:<input type="text" id="UserAccount" onKeyPress="JumpByEnter(Use ...
- 如何更好的理解(pageX,pageY,clientX,clientY,eventX,eventY,scrollX,scrollY,screenX,screenY,event.offsetX,event.offsetY,offsetLeft,style.left)
1 pageX,pageY:鼠标指针相对于当前窗口的X,Y坐标,计算区域包括窗口自身的控件和滚动条.(火狐特有) 2 event.clientX,event.clientY:鼠标指针相对于当前窗口的X ...
- flume sink两种类型 file_rool 自定义sing com.mycomm.MySink even if there is only one event, the event has to be sent in an array
mkdir /data/UnifiedLog/; cd /data/UnifiedLog/; wget http://mirror.bit.edu.cn/apache/flume/1.8.0/apac ...
- javascript & global event & custom event
javascript & global event & custom event new CustomEvent object let event = new CustomEvent( ...
- Event Bus & Event Emitter
Event Bus & Event Emitter Event Bus https://code.luasoftware.com/tutorials/vuejs/parent-call-chi ...
- Jquery 中的 event、event.target 和原生JS的 event、event.target 对比
先看下原生的 event,如图: 再看下 Jquery 中的 event,如图: 明显不一样,也符合常理,比较结果: 那么如何把 Jquery 中的 event 转成原生的呢? event.orig ...
- Javascript中event.srcElement和event.target的区别
event.srcElement 可以捕获当前事件作用的对象,如event.srcElement.tagName可以捕获活动标记名称.注意获取的标记都以大写表示,如"TD",&qu ...
随机推荐
- 【大数据之数据仓库】GreenPlum PK DeepGreen(TPCH)
1.背景 一张UML类图可以简单的说明GreenPlum和DeepGreen之间的关系: GreenPlum: 主页:http://greenplum.org/ 源码:开源,https://githu ...
- Setter
这个还是比较好理解的. 设置器. 用法还是比较简单的. 语法特征: 设置属性[Property] 填充值[Value] 注意这个是封闭单行闭合标签,可以换行,但只允许在同一个标签闭合. 事例用法: & ...
- kali linux之手动漏洞挖掘二
漏洞挖掘原则/宗旨----所有变量,所有头(cookie中的变量),逐个变量删除 身份认证 常用若口令/基于字典的密码爆破/锁定帐号 信息收集(手机号,身份证,住址信息等等) 密码嗅探 会话sessi ...
- loj#6041. 「雅礼集训 2017 Day7」事情的相似度(后缀自动机+启发式合并)
题面 传送门 题解 为什么成天有人想搞些大新闻 这里写的是\(yyb\)巨巨说的启发式合并的做法(虽然\(LCT\)的做法不知道比它快到哪里去了--) 建出\(SAM\),那么两个前缀的最长公共后缀就 ...
- 【SSO单点系列】(7):CAS4.0 SERVER通过数据库方式认证用户
在前几篇中有简单介绍服务端的认证方式,默认的是直接在 deployerConfigContext.xml 文件中 一个叫做 primaryAuthenticationHandler 的bean中配置. ...
- Python实现——二元线性回归(最小二乘法)
2019/3/30 二元线性回归--矩阵公式法_又名:对于python科学库的糟心尝试_ 二元线性回归严格意义上其实不过是换汤不换药,我对公式进行推导,其实也就是跟以前一样的求偏导并使之为零,并且最终 ...
- ob系列函数归纳
输出控制函数(output control函数) flush — 刷新输出缓冲ob_clean — 清空(擦掉)输出缓冲区ob_end_clean — 清空(擦除)缓冲区并关闭输出缓冲ob_end_ ...
- ASP.NET后台取html控件值方式
1.Request.Form[“cbName”]: 可以在后台取到所有为name 为的控件的value值 2.可以通过 把html控件的值付给HiddenField,然后后台调用 3.就是自定义属性 ...
- 【Java】qatools.properties
Link: https://github.com/qatools/properties 今天在GitHub上看到一个Java库,能方便帮助读取properties的配置文件. 具体使用可以参考上面的链 ...
- tornado 04 模板
一.模板 #模板就是一个HTML文件,只是其中添加了模板语法,需要服务器的渲染才能正常显示数据 #通过render可以返回一个html网页,不过那都是固定的页面,固定的数据,如果数据是不确定的,是会不 ...