Just as Ext.core.Element wraps around a native DOM node, Ext.EventObject -wraps the browser's native event-object normalizing cross-browser differences, -such as which mouse button is clicked, keys pressed, mechanisms to stop -event-propagation along with a method to prevent default actions from taking place.
- -For example:
- -function handleClick(e, t){ // e is not a standard event object, it is a Ext.EventObject
- e.preventDefault();
- var target = e.getTarget(); // same as t (the target HTMLElement)
- ...
-}
-
-var myDiv = Ext.get("myDiv"); // get reference to an Ext.core.Element
-myDiv.on( // 'on' is shorthand for addListener
- "click", // perform an action on click of myDiv
- handleClick // reference to the action handler
-);
-
-// other methods to do the same:
-Ext.EventManager.on("myDiv", 'click', handleClick);
-Ext.EventManager.addListener("myDiv", 'click', handleClick);
-Returns a normalized keyCode for the event.
-Returns a normalized keyCode for the event.
-The key code
-Returns a point object that consists of the object coordinates.
-Returns a point object that consists of the object coordinates.
-point
-Gets the related target.
-Gets the related target.
-(optional) A simple selector to filter the target or look for an ancestor of the target
-(optional) The max depth to search as a number or element (defaults to 10 || document.body)
-(optional) True to return a Ext.core.Element object instead of DOM node
-Gets the target for the event.
-Gets the target for the event.
-(optional) A simple selector to filter the target or look for an ancestor of the target
-(optional) The max depth to search as a number or element (defaults to 10 || document.body)
-(optional) True to return a Ext.core.Element object instead of DOM node
-Normalizes mouse wheel delta across browsers
-Normalizes mouse wheel delta across browsers
-The delta
-Gets the page coordinates of the event.
-Gets the page coordinates of the event.
-The xy values like [x, y]
-Returns true if the control, meta, shift or alt key was pressed during this event.
-Returns true if the control, meta, shift or alt key was pressed during this event.
-Injects a DOM event using the data in this object and (optionally) a new target. -This is a low-level technique and not likely to be used by application code. The -currently supported event types are:
- -HTMLEvents
- - -MouseEvents
- - -UIEvents
- - -If specified, the target for the event. This -is likely to be used when relaying a DOM event. If not specified, getTarget -is used to determine the target.
-Checks if the key pressed was a "special" key
-Checks if the key pressed was a "special" key
-True if the press is a special keypress
-Prevents the browsers default handling of the event.
-Prevents the browsers default handling of the event.
-Stop the event (preventDefault and stopPropagation)
-Stop the event (preventDefault and stopPropagation)
-Returns true if the target of this event is a child of el. Unless the allowEl parameter is set, it will return false if if the target is el. -Example usage:
- -// Handle click on any child of an element
-Ext.getBody().on('click', function(e){
- if(e.within('some-el')){
- alert('Clicked on a child of some-el!');
- }
-});
-
-// Handle click directly on an element, ignoring clicks on child nodes
-Ext.getBody().on('click', function(e,t){
- if((t.id == 'some-el') && !e.within(t, true)){
- alert('Clicked directly on some-el!');
- }
-});
-The id, DOM element or Ext.core.Element to check
-(optional) true to test if the related target is within el instead of the target
-{optional} true to also check if the passed element is the target or related target
-