target属性用于返回最初触发事件的DOM元素。
target属性用于返回最初触发事件的DOM元素。
在HTML文档中,我们为<p>元素绑定点击事件("click"),由于DOM元素的事件冒泡机制,我们点击<p>元素内的一个<span>元素就可以触发<p>元素上绑定的click事件。
target属性就用于返回最初触发事件的DOM元素,也就是本例中的<span>元素。(currentTarget属性始终返回的都是该<p>元素)
该属性属于jQuery的Event对象(实例)。
语法
jQuery 1.3 新增该属性。
eventObject.target
返回值
target属性的返回值是Element类型,返回最初触发事件的DOM元素。
示例&说明
请参考下面这段HTML示例代码:
<div id="n1" style="height: 100px; background: #eee;" >
<br>
<p id="n2" style="background: #999;" >段落文本...段落文本...<br>
<span id="n3" style="background: #fff;" >专注于编程开发技术分享</span>
</p>
</div>
jQuery示例代码如下(以下点击事件中的event.currentTarget属性始终指向div元素):
$("div").click( function(event) {
alert("最初触发事件的是:" + event.target.tagName + "#" + event.target.id);
} );
// 点击span元素区域,弹出:"最初触发事件的是:SPAN#n3"
// 点击p元素自身区域,弹出:"最初触发事件的是:P#n2"
// 点击div元素自身区域,弹出:"最初触发事件的是:DIV#n1"
转载的网址:http://www.365mini.com/page/jquery-event-target.htm
target属性用于返回最初触发事件的DOM元素。的更多相关文章
- 父元素onmouseover触发事件在父子元素间移动不停触发的问题
今天写了一个侧边栏动态展开收缩的效果 <!DOCTYPE html> <html lang="en"> <head> <meta char ...
- IE attachEvent事件处理程序(事件绑定的函数)的this指向的是window不是执行当前事件的dom元素
IE attachEvent事件处理程序(事件绑定的函数)的this指向的是window不是执行当前事件的dom元素. attachEvent(type,listener); listener函数中的 ...
- C#实现某一属性值变化时触发事件
在我们做工业软件中,经常会遇到要实时监控某一点,在这个点变化时去做一些事情 放入程序里呢,就是要实时监控某一属性的值,当值发生变化时触发事件,其核心就是借助属性的Set方法,来判断当前set的值是否与 ...
- js实现文本框或文本域在用户输入时(oninput)触发事件,操作元素
写在前面:给不同的文本框设定同样的效果,当文本框没有内容输入时,‘下一步’按钮不可用且透明度为0.5.当有内容输入时(并不是获得焦点时focus),‘下一步’按钮状态可用, 且透明度为1. <s ...
- 关于Input内容改变的触发事件
1.onchange onchange 事件会在域的内容改变时触发.支持的标签<input type="text">, <textarea>, <se ...
- input 内容改变的触发事件
1. onchange onchange 事件会在域的内容改变时触发.支持的标签<input type="text">, <textarea>, <s ...
- bootstrap datepicker 属性设置 以及方法和事件
DatePicker支持鼠标点选日期,同时还可以通过键盘控制选择: page up/down - 上一月.下一月 ctrl+page up/down - 上一年.下一年 ctrl+home - 当前月 ...
- datepicker 属性设置 以及方法和事件
DatePicker支持鼠标点选日期,同时还可以通过键盘控制选择: page up/down - 上一月.下一月 ctrl+page up/down - 上一年.下一年 ctrl+home - 当前月 ...
- input 内容发生改变时触发事件
oninput,onpropertychange,onchange的用法 onchange触发事件必须满足两个条件: a)当前对象属性改变,并且是由键盘或鼠标事件激发的(脚本触发无效) b)当前对象失 ...
随机推荐
- windows下PyCharm安装及使用
一.首先安装pycharm,可以参考这篇文章:http://www.jianshu.com/p/042324342bf4 1.win10_X64,其他Win版本也可以. 2.PyCharm版本:Pro ...
- 微信小程序 取随机数
第一思路 如:现在要从50< . =<100内取一个随机数: ran.Next(1,50)生成的是1-50的随机数+50 结束 第二思路 Math.random()的取值范围是: 0&l ...
- C++ Circle
作业链接 https://github.com/How-Come/object-oriented/tree/master/Circle
- Android混合式开发(Hybrid)
安卓混合式开发(Hybrid) 1 环境搭建 1.1 首先,下载 Android Studio (Intellij Idea) 下载地址:http://www.android-studio.org/ ...
- 【http学习杂记】2017年7月14日
1. 连接超时 连接超时是tcp协议层次, 此时服务器还没有处理请求数据,也就是说服务器的逻辑开没有执行 2. 请求超时 请求超时属于服务器已经连接成功并开始处理,但是时间比较长,大于你设置的请求超时 ...
- MySQL安装俩个不同版本服务出现的问题(1053)
在使用命令mysqld --install servicename --defaults-file='file_name'创建mysql服务时,系统 已提示创建服务成功,但是net start命令提示 ...
- ubuntu下以16进制形式查看class文件、反编译class文件
参考:https://blog.csdn.net/xyh930929/article/details/83860464 1.vim HelloWorld.class 2.输入英文状态下的冒号:,然后输 ...
- 一些需要禁用的PHP危险函数
phpinfo()功能描述:输出 PHP 环境信息以及相关的模块.WEB 环境等信息.危险等级:中 passthru()功能描述:允许执行一个外部程序并回显输出,类似于 exec().危险等级:高 e ...
- centos下mysqlreport安装和使用
首先查看你的机器是否安装了perl: #perl -v 显示版本号即表示已安装 然后: #yum install perl-DBD-mysql perl-DBI #yum install mysqlr ...
- programming-languages学习笔记--第9部分
programming-languages学习笔记–第9部分 */--> pre.src {background-color: #292b2e; color: #b2b2b2;} pre.src ...