A function that provides core event listening functionality. With this function you can provide a target, event type, and listener to be notified of future matching events that are fired.
To listen for "click" events on a button node, we can do:
define(["dojo/on"], function(listen){
on(button, "click", clickHandler);
...
Evented JavaScript objects can also have their own events.
var obj = new Evented; on(obj, "foo", fooHandler);
And then we could publish a "foo" event:
on.emit(obj, "foo", {key: "value"});
We can use extension events as well. For example, you could listen for a tap gesture:
define(["dojo/on", "dojo/gesture/tap", function(listen, tap){
on(button, tap, tapHandler);
...
which would trigger fooHandler. Note that for a simple object this is equivalent to calling:
obj.onfoo({key:"value"});
If you use on.emit on a DOM node, it will use native event dispatching when possible.
| Parameter | Type | Description |
|---|---|---|
| target | Element | Object | This is the target object or DOM element that to receive events from |
| type | String | Function | This is the name of the event to listen for or an extension event type. |
| listener | Function | This is the function that should be called when the event fires. |
| dontFix | undefined |
An object with a remove() method that can be used to stop listening for this event.
See the dojo/on reference documentation for more information.
| Parameter | Type | Description |
|---|---|---|
| target | undefined | |
| type | undefined | |
| event | undefined |
Check if a node match the current selector within the constraint of a context
| Parameter | Type | Description |
|---|---|---|
| node | DOMNode | The node that originate the event |
| selector | String | The selector to check against |
| context | DOMNode | The context to search in. |
| children | Boolean | Indicates if children elements of the selector should be allowed. This defaults to true |
| matchesTarget | Object | dojo/query |
Optional An object with a property "matches" as a function. Default is dojo/query. Matching DOMNodes will be done against this function The function must return a Boolean. It will have 3 arguments: "node", "selector" and "context" True is expected if "node" is matching the current "selector" in the passed "context" |
The matching node, if any. Else you get false
This function acts the same as on(), but will only call the listener once. The listener will be called for the first event that takes place and then listener will automatically be removed.
| Parameter | Type | Description |
|---|---|---|
| target | undefined | |
| type | undefined | |
| listener | undefined | |
| dontFix | undefined |
| Parameter | Type | Description |
|---|---|---|
| target | undefined | |
| type | undefined | |
| listener | undefined | |
| addListener | undefined | |
| dontFix | undefined | |
| matchesTarget | undefined |
This function acts the same as on(), but with pausable functionality. The returned signal object has pause() and resume() functions. Calling the pause() method will cause the listener to not be called for future events. Calling the resume() method will cause the listener to again be called for future events.
| Parameter | Type | Description |
|---|---|---|
| target | undefined | |
| type | undefined | |
| listener | undefined | |
| dontFix | undefined |
Creates a new extension event with event delegation. This is based on the provided event type (can be extension event) that only calls the listener when the CSS selector matches the target of the event.
The application must require() an appropriate level of dojo/query to handle the selector.
| Parameter | Type | Description |
|---|---|---|
| selector | undefined | The CSS selector to use for filter events and determine the |this| of the event listener. |
| eventType | undefined | The event to listen for |
| children | undefined | Indicates if children elements of the selector should be allowed. This defaults to true |
require(["dojo/on", "dojo/mouse", "dojo/query!css2"], function(listen, mouse){
on(node, on.selector(".my-class", mouse.enter), handlerForMyHover);