W3cubDocs

/DOM

CustomEvent.constructor

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 to null, 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
DOM
The definition of 'CustomEvent()' in that specification.
Living Standard Initial definition.

Browser compatibilityUpdate compatibility data on GitHub

Desktop
Chrome Edge Firefox Internet Explorer Opera Safari
Basic support 15 Yes 11 No 11.6 No
No
Available on Nightly build (535.2)
Mobile
Android webview Chrome for Android Edge Mobile Firefox for Android Opera for Android iOS Safari Samsung Internet
Basic support Yes Yes Yes Yes Yes No
No
Available on Nightly build (535.2)
?

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: undefined };
    var evt = document.createEvent( 'CustomEvent' );
    evt.initCustomEvent( event, params.bubbles, params.cancelable, params.detail );
    return evt;
   }

  CustomEvent.prototype = window.Event.prototype;

  window.CustomEvent = CustomEvent;
})();

Internet Explorer >= 9 adds a CustomEvent object to the window, but with correct implementations, this is a function.

See also

© 2005–2018 Mozilla Developer Network and individual contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent/CustomEvent