在 Chrome 12 中调试 Javascript Click 处理程序答案

【问题标题】：Debugging Javascript Click handler in Chrome 12在 Chrome 12 中调试 Javascript Click 处理程序
【发布时间】：2023-03-15 09:12:02
【问题描述】：

oLink = document.getElementById("ItemDescend");
alert(oLink); // fire up alert with link target
addEventHandler(oLink, "click", function(e) { alert(1); sortTable('theList', 0, true); preventDefault(e); },false); // does not fire up inner alert!

上面的代码在测试的所有其他浏览器中都能正常工作，但在 Chrome 12 中却不行。如果有人向我展示解决方案，我将不胜感激。谢谢。

【问题讨论】：

什么是addEventHandler？您必须发布实现，否则我们无能为力。
function(oNode, sEvt, fnHandler, bCapture) { if (typeof (window.event) != "undefined") oNode.attachEvent("on" + sEvt, fnHandler);否则 oNode.addEventListener(sEvt, fnHandler, bCapture); },
那是因为 Chrome 有window.event，但没有attachEvent。最好检查一下 oNode 是否定义了attachEvent。更好的是，使用一个将这些细节抽象出来的框架。
但是在窗口加载事件中这个功能正在工作。这怎么可能？

标签： javascript debugging google-chrome event-handling

【解决方案1】：

您的 addEventHandler 方法正在检查不相关的属性，这是错误的。

相反，您应该检查 addEventListener 方法，如果不存在则仅调用 attachEvent。
将条件更改为

if (typeof (oNode.addEventListener) !== "function")

【讨论】：

它对我有用：jsfiddle.net/nqmJf 你可能有错字或其他问题。
addEventListener 是宿主方法，使用 typeof 测试时可能不会返回 function（例如，在 IE 中，方法已实现使用 ActiveX 返回“未知”），所以最好使用if (oNode.addEventListener)。
我在 jsfiddle.net/nqmJf 中得到 [Object HTMLDivElement]，而不是 1。建议您将该 div 设为链接，以防万一……我没试过……
@Rob：我想知道这一点。我曾希望 IE9 能解决这个问题，这是唯一带有 addEventListener 的版本。
@SLaks - IE 也可以为宿主对象的方法返回“object”和“other”。我认为一般规则是：不要依赖实现 ECMAScript 功能的宿主对象，代码到最低公分母（嗯，至少 IE 6 和更高版本）:-)

【解决方案2】：

addEventHandler(obj,type,fn)
{
    if(obj.addEventListener)
    {
        obj.addEventListener(type,fn,false);
    }
    else if (obj.attachEvent)
    {
        obj.attachEvent("on"+type,fn);
    }

}

【讨论】：

可能值得注意的是，当被调用时，监听器的 this 将根据添加它的方法不同设置。