In these examples the checkboxes add and remove event listeners. Checking a box calls register(...) and unchecking calls unregister(...), the crossbrowser scripts that in turn call either addEventListener()/removeEventListener() or attachEvent()/detachEvent() respectively.

Single listener


register event listener

Multiple listeners on same element

Make sure adding or removing one listener function doesn't effect the other listener function.


hugs kisses

Multiple event types, same listener, same element

Adding or removing the same listener function on the same element for different event types shouldn't effect listeners for other event types.

mouse down mouse up

FIXME: selenium doesn't do mousedown/mouseup event types, so this test isn't automated.

The this keyword in IE

Relying on IE's attachEvent usually means that the this keyword cannot be used in your event handler (more on this at quirksmode). The register() and unregister() methods employ a workaround that allows you to use the this keyword in your event listeners in IE.

(if it smiles when you click the box it means it worked)

TODO: adding/removing same listener more than once

Redundant registers and unregisters should be safe. The listener should only be added once. Redundant removes should continue silently.