W3cubDocs

/Web APIs

CustomEvent: CustomEvent() constructor

The CustomEvent() constructor creates a new CustomEvent object.

Syntax

js

new CustomEvent(type)
new CustomEvent(type, options)

Parameters

type

A string providing the name of the event. Event names are case-sensitive.

options Optional

An object that, in addition of the properties defined in Event(), can have the following properties:

detail Optional

An event-dependent value associated with the event. This value is then available to the handler using the CustomEvent.detail property. It defaults to null.

Return value

A new CustomEvent object.

Example

js

// create custom events
const catFound = new CustomEvent("animalfound", {
  detail: {
    name: "cat",
  },
});
const dogFound = new CustomEvent("animalfound", {
  detail: {
    name: "dog",
  },
});

// add an appropriate event listener
obj.addEventListener("animalfound", (e) => console.log(e.detail.name));

// dispatch the events
obj.dispatchEvent(catFound);
obj.dispatchEvent(dogFound);

// "cat" and "dog" logged in the console

Additional examples can be found at Creating and triggering events.

Specifications

Browser compatibility

Desktop Mobile
Chrome Edge Firefox Internet Explorer Opera Safari WebView Android Chrome Android Firefox for Android Opera Android Safari on IOS Samsung Internet
CustomEvent 15 12 11 No 11.6 6 4.4 18 14 12 6 1.0

See also

© 2005–2023 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent/CustomEvent