获得原始目标的最佳方式

什么是jQuery喜欢和/或最佳实践方式来获取jQuery(或一般的浏览器javascript)中的事件的原始目标。

我一直在用这样的东西

$('body').bind('click', function(e){ //depending on the browser, either srcElement or //originalTarget will be populated with the first //element that intercepted the click before it bubbled up var originalElement = e.srcElement; if(!originalElement){originalElement=e.originalTarget;} }); 

哪个有效,但我对两线function嗅探并不满意。 有没有更好的办法?

您可以使用var originalElement = e.srcElement || e.originalTarget;在一行中var originalElement = e.srcElement || e.originalTarget; var originalElement = e.srcElement || e.originalTarget; 但它不像JQuery那样漂亮;-)

[编辑:但根据http://docs.jquery.com/Events/jQuery.Event#event.target event.target可能会…]

我相信e.target就是你所需要的

 $('body').bind('click', function(e){ e.target // the original target e.target.id // the id of the original target }); 

如果你去jQuery in Action网站下载源代码,请看看

  • 第4章 – dom.2.propagation.html

它涉及使用气泡和捕获处理程序进行事件传播

使用event.originalTarget会导致“权限被拒绝从非chrome上下文访问属性’XYZ’” – error,所以我建议使用以下内容:

 var target = event.target || event.srcElement || event.originalTarget; 

event.target适用于Firefox,Opera,Google Chrome和Safari。

结合如何检测元素外的点击? 这里是你如何捕获一个具有类似隐藏点击外部function的子窗口小部件,以防止你自己的弹出窗口随之隐藏; 在这种情况下,我们正在捕获JQuery UI Datepicker弹出窗口小部件:

 // not using jquery .one handler for this, so we can persist outside click later $('html').click(function(evt) { // just return if element has the datepicker as a parent if ($(evt.target).parents('#ui-datepicker-div').length>0) return; //toggle shut our widget pop-over $('#mywidget').toggle(); // now, unbind this event since our widget is closed: $(this).unbind(evt); }); 

在普通的Javascript中,var t =(e.originalTarget)?e.originalTarget:e.srcElement; 应该足以在所有浏览器中阅读它。