我需要一个跨浏览器功能来注册事件处理程序和(主要是)一致的处理程序体验.我不需要jQuery之类的库的全部功能或功能,因此我已经编写了自己的库.我相信我已经通过下面的代码实现了我的目标,到目前为止,我的测试已经成功完成了,但是我一直盯着它太久了.我的逻辑或陷阱中是否缺少任何缺陷?
编辑1:为了清楚起见,用浏览器意图注释了每个块. IE块已更新,不再立即调用func(这要感谢Andy E’s keen eyes).
编辑2:更新了IE块而不是elem来调用func.call().
编辑3:更新为通过“好零件”通过JSLint.
function hookEvent(elem, evt, func)
{
if (typeof elem === "string")
{
elem = document.getElementById(elem);
}
if (!elem)
{
return null;
}
var old, r;
if (elem.addEventListener) //w3c
{
elem.addEventListener(evt, func, false);
r = true;
}
else if (elem.attachEvent) //ie
{
elem[evt + func] = function ()
{
func.call(this, window.event);
};
r = elem.attachEvent("on" + evt, elem[evt + func]);
}
else //old
{
old = elem["on" + evt] ? elem["on" + evt] : function (e) { };
elem["on" + evt] = function (e)
{
if (!e)
{
e = window.event;
}
old.call(this, e);
func.call(this, e);
};
r = true;
}
return r;
}
解决方法:
这条线上有一个问题:
r = elem.attachEvent("on" + evt, func.call(elem, window.event));
这将立即执行func(),而不是将其作为事件的处理程序附加.取而代之的是,将func()的返回值分配给该事件,如果其类型不是“ function”,则将引发错误.
我可以理解,您不想使用框架,但是许多其他许多人都编写了跨浏览器事件处理代码段. John Resig有一个版本,Google提供了更多的“ javascript addEvent”版本.
http://www.google.com/search?q=javascript+addevent