DOM events in the Microsoft Ajax Library formerly known as Atlas ...

This has now all changed and a new API is in town.

    The new model for DOM events is thus introducing a new API, but at least it is closely modeled after the standard APIs so it should feel pretty familiar. There are many differences in the implementations of DOM events that we needed to abstract. The first one is in the names of the methods that you call to add an event. In standard browsers, you use add/removeEventListener, in IE it is attach/detachEvent. The event names themselves are different: "click" is "onclick" in IE. Then, you have to abstract the signature of the event handlers themselves: in IE the parameters come from the global window.event object, in other browsers they are passed as a parameter. Finally, the contents of the event parameter object are themselves widely divergent from one browser to the other: mouse buttons don have the same values for example, and some very useful stuff like mouse positions is missing altogether from the standard.

To do work you now:
PLAIN TEXT
JAVASCRIPT:

   1.
      
   2.
      // register a handler (shortcut for Sys.UI.DomEvent.addHandler)
   3.
      $addHandler(myDomElement, "click", someFunction);
   4.
      
   5.
      // Enums in event handlers
   6.
      function myClickHandler(e) {
   7.
        if (e.button === Sys.UI.MouseButton.leftButton) {
   8.
          //...
   9.
        }
  10.
      }
  11.
      
  12.
      function myKeyUpHandler(e) {
  13.
        if (e.keyCode === Sys.UI.Key.enter) {
  14.
          //...
  15.
        }
  16.
      }
  17.
      

There are also some other new features such as helpers to make component developers lives easier.

For example, an accessible hover behavior might want to subscribe to mouseover, mouseout, focus and blur. To do that, you would typically create delegates to your handlers and then wire up these delegates to the DOM events one by one. From your "dispose" method, you would also have to remove those handlers one by one and get rid of the delegates. Seeing that this pattern was repeated over and over again in almost any control or behavior sample, we decided to add helpers to batch those operations. So here is how you would wire up all those events:
PLAIN TEXT
JAVASCRIPT:

   1.
      
   2.
      $addHandlers(this.get_element(), {
   3.
        mouseover: this._onHover,
   4.
        mouseout: this._onUnhover,
   5.
        focus: this._onHover,
   6.
        blur: this._onUnhover
   7.
      }, this);
   8.
source: ajaxian

 Original Source: