代码改变世界

target属性用于返回最初触发事件的DOM元素。

2015-12-28 17:53  流浪的诗人  阅读(526)  评论(0编辑  收藏  举报

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