javascript – 在旧版Internet Explorer中重新定位事件期间,检查一个事件是否与另一个事件相同

前端之家收集整理的这篇文章主要介绍了javascript – 在旧版Internet Explorer中重新定位事件期间,检查一个事件是否与另一个事件相同前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
如果您在Internet Explorer中尝试此操作,您可以看到在冒泡期间调度的事件不是唯一的:
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

有没有办法在代码中唯一标识一个事件来解决这种缺乏功能的问题?

解决方法

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).

猜你在找的JavaScript相关文章