IE8 onclick处理程序事件

6

我已经阅读了quirksmode.org上大部分相关文章,但仍然对以下问题不确定:

在使我的应用与IE8兼容时(好开心啊),当尝试将onclick事件设置为链接时,我遇到了这个问题:

function myClickHandler(event)
{
    alert(event);
}

var link = document.getElementById("myLink");
link.onclick = myClickHandler; //first option

相反的是:

function myClickHandler(event)
{
    alert(event);
}

var link = document.getElementById("myLink");
link.onclick = function() {
   myClickHandler(event); //second option
}

使用第一种选项,myClickHandler会弹出undefined。而使用第二种选项会弹出[object Event],这让我相信在第一种选项中事件对象没有传递给处理程序。为什么在IE8上会这样呢?
注意:不想使用attachEvent,因为我想在执行期间覆盖单个侦听器,并且onclick似乎很适合这里。
2个回答

11

是的,在IE <= 8中,DOM0风格的事件处理程序没有将事件对象作为参数传递。你需要从window.event获取它。如果你添加一个名为event的参数,在IE <= 8中,这将是undefined,而事件处理程序中对于event的引用将解析为未定义的参数,而不是window.event。我通常使用window.event来在代码中明确表示这一点:

link.onclick = function(evt) {
   evt = evt || window.event;
}

0

曾经我需要在窗口上处理点击事件并在IE8中使用target属性
我在项目中使用的解决方案:

 document.onclick = function(event) {
                event = event || fixEvent.call(this, window.event);
                var target = event.target || event.srcElement;
                var className = target.className;
                // ....
            };




//For IE8 
// source: https://learn.javascript.ru/fixevent
    function fixEvent(e) {

       e.currentTarget = this;
       e.target = e.srcElement;

       if (e.type == 'mouseover' || e.type == 'mouseenter') e.relatedTarget = e.fromElement;
       if (e.type == 'mouseout' || e.type == 'mouseleave') e.relatedTarget = e.toElement;

       if (e.pageX == null && e.clientX != null) {
           var html = document.documentElement;
           var body = document.body;

           e.pageX = e.clientX + (html.scrollLeft || body && body.scrollLeft || 0);
           e.pageX -= html.clientLeft || 0;

           e.pageY = e.clientY + (html.scrollTop || body && body.scrollTop || 0);
           e.pageY -= html.clientTop || 0;
       }

       if (!e.which && e.button) {
           e.which = e.button & 1 ? 1 : (e.button & 2 ? 3 : (e.button & 4 ? 2 : 0));
       }

       return e;
   }

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接