Comprobar si un evento es idéntico a otro durante el evento de reorientación en los mayores de Internet Explorer

Question

Si intenta esto en Internet Explorer se puede ver que el evento distribuido no es aplicable sólo durante el burbujeo:

var x; 
myinnerdiv.onclick = function() { x = window.event; }; 
myparentdiv.onclick = function() { alert(x === window.event); }; 
// false, but should be the same! 

Usando el equivalente en estándares basado en el método:

var x; 
myinnerdiv.onclick = function(ev) { x = ev; }; 
myparentdiv.onclick = function(ev) { alert(x === ev); }; 
// true: same event, retargeted 

¿Hay alguna manera de identificar un evento en el código para evitar esta falta de funcionalidad?

Answer 1

window.event no es un valor de datos sino una función getter para crear objetos de evento. Al igual que la mayoría de de las propiedades DOM no son valores de datos sino funciones de acceso.

Incluso se puede hacer uno al lado del otro:

div.onclick = function() { 
    var a = window.event; 
    var b = window.event; 
    alert(a === b) // false 
}; 

De todos modos, simplemente hacer su propia función:

window.getEvent = (function() { 
    var e = {}; 

    return function() { 
     var cur = window.event; 
     if(cur.type === e.type && 
      cur.srcElement === e.srcElement && 
      cur.clientX === e.clientX && 
      cur.clientY === e.clientY && 
      cur.keyCode === e.keyCode) { 
      return e.evt; 
     } 
     e.type = cur.type; 
     e.srcElement = cur.srcElement; 
     e.clientX = cur.clientX; 
     e.clientY = cur.clientY; 
     e.keyCode = cur.keyCode; 
     e.evt = cur; 
     return cur; 
    }; 
})(); 

myinnerdiv.onclick = function() { 
    var event = getEvent(); 
    event.myCustomProp = 3; 
}; 
myparentdiv.onclick = function() { 
    var event = getEvent(); 
    alert(event.myCustomProp === 3); 
}; 

Se supone que estos 5 valores son suficientes para ver si los objetos de eventos representan el mismo evento, que me parece razonable.

Test page here, haga clic en, precisamente, el texto 'asd' (rojo coloreado), como el HTML es:

<div id="myparentdiv"> 
    daa 
    <div id="myinnerdiv">asd</div> 
    daa 
</div> 

Si quieres algo que funcione para seguro entonces sólo tiene que utilizar jQuery, que básicamente tienen que crear un todo modelo de evento desde cero para hacer esto de forma más limpia (y siempre use la API de ese modelo de evento).

Answer 2

Una forma sencilla: basta con comparar event1.timeStamp y event2.timeStamp