文档章节

target与currentTarget区别

freedonn
 freedonn
发布于 2015/03/17 09:51
字数 207
阅读 82
收藏 3

target在事件流的目标阶段;currentTarget在事件流的捕获,目标及冒泡阶段。只有当事件流处在目标阶段的时候,两个的指向才是一样的, 而当处于捕获和冒泡阶段的时候,target指向被单击的对象而currentTarget指向当前事件活动的对象(一般为父级)。

<div id="outer" style="background:#099"> 
        click outer 
        <p id="inner" style="background:#9C0">click inner</p> 
        <br> 
    </div> 
     
    <script type="text/javascript"> 
    function G(id){ 
        return document.getElementById(id);     
    } 
    function addEvent(obj, ev, handler){ 
        if(window.attachEvent){ 
            obj.attachEvent("on" + ev, handler); 
        }else if(window.addEventListener){  
            obj.addEventListener(ev, handler, false); 
        } 
    } 
    function test(e){ 
        alert("e.target.tagName : " + e.target.tagName + "\n e.currentTarget.tagName : " + e.currentTarget.tagName); 
    } 
    var outer = G("outer"); 
    var inner = G("inner"); 
    //addEvent(inner, "click", test); 
    addEvent(outer, "click", test); 
    </script>

上面的示例中,当在outer上点击时,e.target与e.currentTarget是一样的,都是div;当在inner上点击时,e.target是p,而e.currentTarget则是div。

本文转载自:

freedonn

freedonn

粉丝 25
博文 258
码字总数 16565
作品 0
潍坊
程序员
私信 提问
常用事件方法及技巧(六) -- Event(事件)

这个按道理应该放在最开始讲的,我把放到了最后面,却是想做个总结。这篇和后面的两篇,我为大家讲解下事件总纲。总纲这个词是我自己定义的,意思是所有事件的基础。用通俗的话来说,就是其他...

余二五
2017/11/09
0
0
JavaScript实用手册

js的拖拽 在拖拽时容易使操作变成选择文本,这时应该添加这段: js的event对象 先看文章的代码: currentTarget:事件冒泡阶段所在的DOM。在捕获事件时,这个currentTarget就为监听事件的那个D...

前端届的科比
2015/09/03
65
0
js:Event.currentTarget与Event.target的区别

e.target is what triggers the event dispatcher to trigger and e.currentTarget is what you assigned your listener to. 举个例子: 事件是绑定到div上的,点击div中的按钮时: 点击div......

樂天
2015/11/27
79
0
jQuery学习笔记8:事件对象

1 事件对象 样例: //通过event.type 属性获取触发事件名 $('input').click(function (e) { alert(e.type); }); //通过event.target 获取绑定的DOM 元素 $('input').click(function (e) { al......

技术小胖子
2017/11/17
0
0
JS和JQ的event对象对比和应用

currentTarget 事件冒泡阶段所在的DOM target, originalTarget原始的DOM 代码测试: 结果分析: 总结: js的event参数中,不管是, , 都是指向第一个触发事件的元素(还没冒泡),而在click事...

前端届的科比
2014/08/11
0
0

没有更多内容

加载失败,请刷新页面

加载更多

以太坊中文文档翻译-区块

本文原文链接 点击这里获取Etherscan API 中文文档(完整版) 完整内容排版更好,推荐读者前往阅读。 区块(Blocks) 区块相关的 API,接口的参数说明请参考Etherscan API 约定, 文档中不单独...

Tiny熊
19分钟前
0
0
Linux 内核的一个问题

是virtio 驱动,但是没有启动 virtio-mmio virtio-mmio.0: Failed to enable 64-bit or 32-bit DMA. Trying to continue, but this might not work.....[ 1.047924] md: ... autorun......

MtrS
43分钟前
2
0
MySQL主从配置

17.1 MySQL主从介绍 17.2 准备工作 17.3 配置主 17.4 配置从 17.5 测试主从同步 一、 MySQL主从介绍

tobej
53分钟前
2
0
读书replay《博弈与社会》.1.20190526

前情 《美丽心灵》,一部讲数学家约翰·福布斯·纳什的电影,我第一次听到博弈理论就是在这部电影里。看过电影之后就一直想知道,博弈论究竟讲了什么。很久之后,20190417这天,我刷JD的购物...

wanxiangming
今天
2
0
iOS TableView层级结构剖析

首先上图 下面来分析一下tableView的层级结构 tableView的组成: 1.整个tableView有且仅有一个头部和尾部就是tableViewHeadView和tableViewFooterView2.tableView 可以有多个section,一个s...

HOrange
今天
3
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部