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元素。的更多相关文章

  1. 父元素onmouseover触发事件在父子元素间移动不停触发的问题

    今天写了一个侧边栏动态展开收缩的效果 <!DOCTYPE html> <html lang="en"> <head> <meta char ...

  2. IE attachEvent事件处理程序(事件绑定的函数)的this指向的是window不是执行当前事件的dom元素

    IE attachEvent事件处理程序(事件绑定的函数)的this指向的是window不是执行当前事件的dom元素. attachEvent(type,listener); listener函数中的 ...

  3. C#实现某一属性值变化时触发事件

    在我们做工业软件中,经常会遇到要实时监控某一点,在这个点变化时去做一些事情 放入程序里呢,就是要实时监控某一属性的值,当值发生变化时触发事件,其核心就是借助属性的Set方法,来判断当前set的值是否与 ...

  4. js实现文本框或文本域在用户输入时(oninput)触发事件,操作元素

    写在前面:给不同的文本框设定同样的效果,当文本框没有内容输入时,‘下一步’按钮不可用且透明度为0.5.当有内容输入时(并不是获得焦点时focus),‘下一步’按钮状态可用, 且透明度为1. <s ...

  5. 关于Input内容改变的触发事件

    1.onchange onchange 事件会在域的内容改变时触发.支持的标签<input type="text">, <textarea>, <se ...

  6. input 内容改变的触发事件

    1. onchange onchange 事件会在域的内容改变时触发.支持的标签<input type="text">, <textarea>, <s ...

  7. bootstrap datepicker 属性设置 以及方法和事件

    DatePicker支持鼠标点选日期,同时还可以通过键盘控制选择: page up/down - 上一月.下一月 ctrl+page up/down - 上一年.下一年 ctrl+home - 当前月 ...

  8. datepicker 属性设置 以及方法和事件

    DatePicker支持鼠标点选日期,同时还可以通过键盘控制选择: page up/down - 上一月.下一月 ctrl+page up/down - 上一年.下一年 ctrl+home - 当前月 ...

  9. input 内容发生改变时触发事件

    oninput,onpropertychange,onchange的用法 onchange触发事件必须满足两个条件: a)当前对象属性改变,并且是由键盘或鼠标事件激发的(脚本触发无效) b)当前对象失 ...

随机推荐

  1. 记Git报错-Everything up-to-date

    文:铁乐与猫 今天git push 到github远程仓库的时候,出现报错"Everything up-to-date",严格来说也不算报错,它只是在告诉你,提交区所有的东西都是最 ...

  2. 映射函数map

    映射函数map 语法: map(function, iterable) 迭代对象中 的每一个元素进行映射, 分别执行function函数 例子:  ls =[1,2,3,4,5,6] def func ...

  3. 【转】爬虫的一般方法、异步、并发与框架scrapy的效率比较

    该文非原创文字,文字转载至  jclian91  链接:https://www.cnblogs.com/jclian91/p/9799697.html Python爬虫的N种姿势   问题的由来    ...

  4. Python简单的购物车小代码

    # -*- coding: utf-8 -*- # @Time : 2018-05-31 14:56 # @Author : 超人 # @Email : huxiaojiu111@gmail.com ...

  5. Angular 星级评分组件

    一.需求演变及描述: 1. 有一个“客户对公司的总体评价”的字段(evalutation).字段为枚举类型,0-5,对应关系为:0-暂无评价,1-很差,2-差,3-一般,4-好,5-很好 2. 后来需 ...

  6. IntelliJ IDEA使用技巧一览表

    1 .写代码时用 Alt-Insert ( Code|Generate… )可以创建类里面任何字段的 getter 与 setter 方法. 2 .右键点击断点标记(在文本的左边栏里)激活速查菜单,你 ...

  7. ansible-playbook快速入门

    一.yaml语法: 1. yaml语法编写 1.1 同层级的字段通过相同缩进表示 1.2 map结构里面key/value用‘:’来分隔 1.3 key/value可以同行写,也可以换行写,换行写必须 ...

  8. Day7 访问权限

    构造者模式思想 进行初始化,解决了多个构造器重载,构造器参数过多记不住的情况. package day7;//声明一个程序包 class Employee{ private String name; ...

  9. js如何将时间戳转换为标准时间

    function formatDate(date,fmt){ let o = { 'M+' : date.getMonth() +1, //月份 'd+' : date.getDate(), //日 ...

  10. Error: Couldn't find preset "env" relative to directory "/Users/user/ethereumjs-vm"

    运行npm run build时遇见这个问题,解决办法是安装: npm install --save-dev babel-preset-env 就解决了