Addeventlistener 已转换为 IE.也许是另一个错误

Addeventlistener converted to IE. Maybe another error?

本文关键字：另一个 错误 也许 IE 转换 Addeventlistener      更新时间：2023-09-26

我制作了一个简单的脚本，当将鼠标悬停在外部div 上时，它会显示一个div（在另一个内部）（这有意义吗？

无论如何，这是代码。 

for (var ost = 1; ost <= 16; ost++) {
        var maelk = String("sovs"+ ost);
        document.getElementById(maelk).addEventListener('mouseover', on, false);
        document.getElementById(maelk).addEventListener('mouseout', off, false);
        }
    function on(e) {
        var t=e.currentTarget.id;
        var g= t.substr(4,5);
        var v="celltext" + g;
        $("#"+v).show();
            //stop(true, false).fadeIn("slow");
    }
    function off(e) {
        var t=e.currentTarget.id;
        var g= t.substr(4,5);
        var v="celltext" + g;
        $("#"+v).hide();
            //stop(true, true).fadeOut("slow");
    }

但这在Internet Explorer上不起作用。我听说原因是addEventListener。所以我尝试将代码编辑为： 

for (var ost = 1; ost <= 16; ost++) {
        var maelk = String("sovs"+ ost);
        var maelkelement = document.getElementById(maelk);
    if (!maelkelement.addEventListener) {
        maelkelement.attachEvent('mouseover', on, false);
        maelkelement.attachEvent('mouseout', off, false);
    }
    else {
        maelkelement.addEventListener('mouseover', on, false);
        maelkelement.addEventListener('mouseout', off, false);
    }
    function on(e) {
        var t=e.currentTarget.id;
        var g= t.substr(4,5);
        var v="celltext" + g;
        $("#"+v).show();
            //stop(true, false).fadeIn("slow");
    }
    function off(e) {
        var t=e.currentTarget.id;
        var g= t.substr(4,5);
        var v="celltext" + g;
        $("#"+v).hide();
            //stop(true, true).fadeOut("slow");
    }

唯一的区别是与IE通信的IF句子。不过这行不通。

有人有什么想法吗？

非常感谢帮助，提前感谢您

问候马蒂亚斯

使用 attachEvent 时，事件名称略有不同。您需要改用'onmouseover'和'onmouseout'：

if (!maelkelement.addEventListener) {
    maelkelement.attachEvent('onmouseover', on);
    maelkelement.attachEvent('onmouseout', off);
}

另请参阅：

  • MDN： element.AddEventListener （"Legacy Internet Explorer and attachEvent"部分）
  • MSDN：附加事件方法
  • MSDN：事件列表

如果这适用于第一个元素，我会感到惊讶，因为在引用之前尚未定义 on 和 off 函数。我会改成 

var on = function(e) {...}
var off = function(e) {...}
for(...) {
  ....addEventListener(..., on, false);
  ....addEventListener(..., off, false);
}

Zeta 是对的：使用 onmouseover 和 onmouseout ，但这仍然不能解决你的问题。除此之外，请务必注意，默认情况下，IE 不会将事件对象传递给处理程序。相反，IE 只有一个 -global- 事件对象，因此您的 on 和 off 函数都必须像这样启动：

function onOrOff(e)
{
    e = e || window.event;//get the global event for ie
    var target = e.target || e.srcElement;//IE's bubbling model doesn't have a target, but a source element
    //Now you can finally get some work done
    if (e.preventDefault)
    {
        e.preventDefault();
        e.stopPropagation();
        return;
    }
    e.returnValue = false;
    e.cancelBubble = true;//bubbling || propagation and preventDefault works differently, too
}

最后：同样，由于冒泡模型，IE不支持事件捕获。因此，attachEvent方法没有第三个参数，因此在IE分支中松开false，您应该已经全部设置好

了
相关文章：