In the "old-style" event registration model, you would typically register events by assigning functions to the onevent property of DOM elements:
elem.onclick = function() { alert("You clicked me"); } The problem with that approach is that you can only assign a single event handler function to any given event. All modern browsers support more advanced event registration mechanisms so you can attach multiple event listeners to any given event, though, as usual, those mechanisms vary across platforms. This recipe can be used to register and unregister event listeners in all modern browsers:
function addEventListener(instance, eventName, listener) { var listenerFn = listener; if (instance.addEventListener) { instance.addEventListener(eventName, listenerFn, false); } else if (instance.attachEvent) { listenerFn = function() { listener(window.event); } instance.attachEvent("on" + eventName, listenerFn); } else { throw new Error("Event registration not supported"); } return { instance: instance, name: eventName, listener: listenerFn }; } function removeEventListener(event) { var instance = event.instance; if (instance.removeEventListener) { instance.removeEventListener(event.name, event.listener, false); } else if (instance.detachEvent) { instance.detachEvent("on" + event.name, event.listener); } }
