翻译不完整。 请帮助我们翻译这篇文章!

The CustomEvent() constructor creates a new CustomEvent.

构造方法 CustomerEvent() 创建一个新的 CustomEvent 对象。

Syntax 语法

 event = new CustomEvent(typeArg, customEventInit);

Values 参数

Is a DOMString representing the name of the event.
一个表示 event 名字的字符串
Is a CustomEventInit dictionary, having the following fields:  一个字典类型参数,有如下字段
  • "detail", optional and defaulting to null, of type any, that is a event-dependant value associated with the event.   可选的默认值是 null 的任意类型数据,是一个与 event 相关的值
  • bubbles 一个布尔值,表示该事件能否冒泡。 来自 EventInit。注意:测试chrome默认为不冒泡。
  • cancelable 一个布尔值,表示该事件是否可以取消。 来自 EventInit

The CustomEventInit dictionary also accepts fields from the EventInit dictionary.

CustomerEventInit 字典参数同样接受来自于 Event 类构造函数的 eventInit 字典参数,如下

bubbles   一个布尔值,表示该事件能否冒泡

cancelable  一个布尔值,表示该事件是否可以取消


// 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


Specification Status Comment
Living Standard Initial definition.

Browser compatibility

Update compatibility data on GitHub
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
CustomEvent() constructorChrome Full support 15Edge Full support ≤18Firefox Full support 11IE No support NoOpera Full support 11.6Safari Full support 6.1WebView Android Full support ≤37Chrome Android Full support 18Firefox Android Full support 14Opera Android Full support 12Safari iOS Full support 6.1Samsung Internet Android Full support 1.0


Full support  
Full support
No support  
No support


You can polyfill the CustomEvent() constructor functionality in Internet Explorer 9 and higher with the following code:

        // a : While a window.CustomEvent object exists, it cannot be called as a constructor.
        // b : There is no window.CustomEvent object
        new window.CustomEvent('T');
        var CustomEvent = function(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;

See also