Question

我有一个事件处理程序，我附加到一个元素来捕获冒泡的点击事件。我需要可靠方式来获取捕获事件的元素，而不是触发它的元素。此特定元素高于srcElement / target的级别数量是任意的，因此使用parentNode或任何不可行的解决方案。这特别需要在IE6中工作。虽然我是jQuery框架的粉丝，但我不会在这里使用jQuery，所以任何jQuery建议都会被认为是无用的。

tl; dr：我在IE6中需要一个可靠的 event.currentTarget，没有jQuery。

非常感谢任何帮助。

Answer 1

更新： attachEvent这里似乎确实存在问题。 From quirksmode.org：

在以下情况中，这指的是窗口：
element.onclick = function () {doSomething()}
element.attachEvent('onclick',doSomething)
<element onclick="doSomething()">
请注意attachEvent()的存在。 Microsoft event registration model的主要缺点是attachEvent()创建了对函数的引用，而不是复制它。因此，有时无法知道哪个HTML当前处理事件。

解决这个问题的唯一方法似乎是创建一个包装器，如：

var addListener = (function() {
    if(document.attachEvent) {
        return function(element, event, handler) {
            element.attachEvent('on' + event, function() {
                var event = window.event;
                event.currentTarget = element;
                event.target = event.srcElement;
                handler.call(element, event);
            });
        };
     }
     else {
        return function(element, event, handler) {
            element.addEventListener(event, handler, false);
        };
     }
}());

然后this将引用该元素，event.currentTarget将引用event作为第一个参数。

用法：

addListener(element, 'click', function(e) {
    // this refers to element
    // e.currentTarget refers to element
    // e.target refers to the element that triggered the event
});

旧答案：（适用于内联和传统事件处理程序，以及addEventListener（但不适用于{{ 1}}））

在事件处理程序中，attachEvent引用事件处理程序附加到的元素。

Answer 2

根据this article，IE根本没有等同于currentTarget。因此，如果找不到绑定事件的方法，以便在target / srcElement中获取正确的元素，则可以尝试将类添加到要捕获事件的元素并遍历DOM树到此元件。

<div class="eventCatcher">
    <div id="eventTrigger>More HTML</div>
</div>

<script>
    function catchEvent(event)
    {
        event = event || window.event;
        target = event.target || event.srcElement;

        while (!target.getAttribute('class').indexOf('eventCatcher') >= 0)
            target = target.parentElement;
    }
</script>

IE6中的event.currentTarget

2 个答案: