addEventListener 在 Chrome 中不起作用

Posted 2023-02-22

【中文标题】addEventListener 在 Chrome 中不起作用

【英文标题】：addEventListener not working in Chrome

【发布时间】：2013-04-04 19:05:50

【问题描述】：

我正在学习 Lynda.com 上有关新 DOM 事件模型的教程。

这是我正在使用的代码。

function addEventHandler(oNode, sEvt, fFunc, bCapture)

if (typeof (window.event) != "undefined")
    oNode.attachEvent("on" + sEvt, fFunc);
else
    oNode.addEventListener(sEvt, fFunc, bCapture);


function onLinkClicked(e)
alert('You clicked the link');


function setUpClickHandler()
addEventHandler(document.getElementById("clickLink"), "click", onLinkClicked, false);



addEventHandler(window, "load", setUpClickHandler, false);

我将其添加到此链接的点击事件中

<a href="#" title="click me" id="clickLink">Click Me!</a>

它在 IE、Firefox、Opra 中运行良好，但在 Chrome 中却不行。我环顾四周，但还没有找到任何具体的东西。一些类似的问题，但它没有回答我的问题。

我从 Chrome 控制台收到以下错误

Uncaught TypeError: Object [object htmlAnchorElement] has no method 'attachEvent' 

任何建议或答案链接。

提前致谢。

【问题讨论】：

这是一个糟糕的教程，并且清楚地表明了测试是否存在您想要使用的对象之外的对象的危险。 if (typeof oNode.attachEvent != "undefined") 会更好。最好还是先测试一下基于标准的函数addEventListener。

【参考方案1】：

你为什么要测试：

if (typeof (window.event) != "undefined")

...为了决定是否使用attachEvent()？ Chrome 确实定义了window.event，因此您的代码会尝试使用未定义的attachEvent()。

尝试直接测试该方法：

if (oNode.attachEvent)
    oNode.attachEvent("on" + sEvt, fFunc);
else
    oNode.addEventListener(sEvt, fFunc, bCapture);

【讨论】：

谢谢，我刚开始研究新的 DOM 事件模型，这是课程中的讲师正在测试的，但它是从 2009 年开始的。但是你的答案是完美的，它没有对我来说也很有意义。为什么该测试不适用于 Chrome，但它适用于所有其他浏览器？但是您的回答有效，谢谢，我也很好奇为什么它不只是跳过它并继续使用 else 语句。

您展示的代码在 2009 年也没有意义。正如我在回答中所说，Chrome 定义了window.event，因此if 条件在Chrome 中为真，从而导致尝试使用Chrome 中未定义的.attachEvent()（如您提到的错误文本所示） ）。原代码在IE中工作，因为它同时定义了window.event和.attachEvent()，而在FF等中工作，因为它没有定义window.event。

谢谢，很好的解释。在第一条评论中错过了。