I need a cross-browser function for registering event handlers and a (mostly) consistent handler experience. I don't need the full weight or functionality of a library such as jQuery, so I've written my own. I believe I've accomplished my goals with the code below, and so far my testing has been successful, but I've been staring at it for too long. Are there any flaws in my logic or gotchas that I'm missing?
EDIT 1: Commented each block with browser intent for clarity. Updated IE block to not call func
right away (thanks to Andy E's keen eyes).
EDIT 2: Updated IE block to call func.call()
with this
instead of elem
.
EDIT 3: Updated to pass JSLint with "the Good Parts."
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;
}