javascript - 在旧版 Internet Explorer 中的事件重定向期间检查一个事件是否与另一个事件相同

Question

如果您在 Internet Explorer 中尝试此操作，您会发现在冒泡期间分派(dispatch)的事件不是唯一的:

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

使用等效的基于标准的方法:

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

有没有一种方法可以在代码中唯一标识事件以解决这种功能不足的问题？

Answer 1

window.event 不是数据值，而是创建事件对象的 getter 函数。很像大多数的 DOM 属性不是数据值而是访问函数。

您甚至可以将它们并排进行:

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

不管怎样，自己做一个函数:

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

它假设这 5 个值足以查看事件对象是否表示同一事件，这对我来说似乎是合理的。

Test page here , 精确点击文本“asd”(红色)，因为 html 是:

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

如果您想要确定有效的东西，那么只需使用 jQuery，您基本上必须从头开始创建整个事件模型更干净地执行此操作(并始终使用该事件模型的 API)。