The CustomEvent()
constructor creates a new CustomEvent
.
Note: This feature is available in Web Workers.
Syntax
event = new CustomEvent(typeArg, customEventInit);
Parameters
typeArg
- A
DOMString
representing the name of the event. customEventInit
Optional- A
CustomEventInit
dictionary, having the following fields:"detail"
, optional and defaulting tonull
, of type any, that is an event-dependent value associated with the event.
The CustomEventInit
dictionary also accepts fields from the EventInit dictionary.
Return value
A new CustomEvent
object of the specified type, with any other properties configured according to the CustomEventInit
dictionary (if one was provided).
Example
// add an appropriate event listener
obj.addEventListener("cat", function(e) { process(e.detail) });
// create and dispatch the event
var event = new CustomEvent("cat", {
detail: {
hazcheeseburger: true
}
});
obj.dispatchEvent(event);
Additional examples can be found at Creating and triggering events.
Specifications
Specification | Status | Comment |
---|---|---|
DOMThe definition of 'CustomEvent()' in that specification. | Living Standard | Initial definition. |
Browser compatibility
The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
Update compatibility data on GitHub
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
CustomEvent() constructor
|
Chrome
Full support 15 |
Edge
Full support ≤18 |
Firefox
Full support 11 |
IE
No support No |
Opera
Full support 11.6 |
Safari
Full support 6.1 |
WebView Android
Full support ≤37 |
Chrome Android
Full support 18 |
Firefox Android
Full support 14 |
Opera Android
Full support 12 |
Safari iOS
Full support 6.1 |
Samsung Internet Android
Full support 1.0 |
Legend
- Full support
- Full support
- No support
- No support
Polyfill
You can polyfill the CustomEvent()
constructor functionality in Internet Explorer 9 and higher with the following code:
(function () {
if ( typeof window.CustomEvent === "function" ) return false;
function CustomEvent ( event, params ) {
params = params || { bubbles: false, cancelable: false, detail: null };
var evt = document.createEvent( 'CustomEvent' );
evt.initCustomEvent( event, params.bubbles, params.cancelable, params.detail );
return evt;
}
window.CustomEvent = CustomEvent;
})();
Internet Explorer >= 9 adds a CustomEvent object to the window, but with correct implementations, this is a function.
See also
CustomEvent() by Mozilla Contributors is licensed under CC-BY-SA 2.5.