La mejor manera de obtener el objetivo original

Question

¿Qué es un jQuery y/o las mejores prácticas para obtener el objetivo original de un evento en jQuery (o en el navegador javascript en general).

He estado usando algo como esto

$('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;}       
}); 

que funciona, pero no estoy satisfecho con la característica de dos líneas olfateando. ¿Hay una mejor manera?

Answer 1

Puede hacerlo en una línea con var originalElement = e.srcElement || e.originalTarget; pero no es bastante similar a jQuery ;-)

[Editar: Pero de acuerdo con http://docs.jquery.com/Events/jQuery.Event#event.targetevent.target podría hacer ...]

Answer 2

creo correo .target es lo que necesita

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

Si vas a la jQuery in Action website y descargar el código fuente, echar un vistazo a

• Capítulo 4 - dom.2.propagation.html

que se ocupa de la propagación de eventos con la burbuja y la captura de los manipuladores

Answer 3

Usando event.originalTarget puede causar "ha denegado el permiso para acceder a la propiedad 'XYZ' de una contexto sin cromo" -error, así que recomiendo el uso siguiente:

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

event.target trabajos en Firefox, Opera, Google Chrome y Safari.

Answer 4

en Javascript normal, var t = (e.originalTarget)? E.originalTarget: e.srcElement; debería ser suficiente para leerlo en todos los navegadores.

Answer 5

En conjunción con How to detect a click outside an element?, aquí se explica cómo puede atrapar un subwidgets con una función similar de ocultar cuando se hace clic fuera para evitar que su propio pop-over se oculte junto con él; en este caso, estamos atrapando el jQuery UI DatePicker emergente sobre widgets:

// 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); 
});