CustomEvent()

CustomEvent() constructor 可用來建立 CustomEvent物件。

語法

javascript

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

參數

type

一個 DOMString 用來表示事件名稱。

options選擇性

一個繼承自Event()的參數，其類型為 object。它有以下參數

detail 選擇性: 用來表示事件相關的資訊。它能藉由 CustomEvent.detail (en-US) 屬性來取得值。其默認值為null。

回傳值

一個 CustomEvent 物件。

範例

javascript

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

可於 Creating and triggering events 找到更多範例。

規格

Specification
DOM Standard # ref-for-dom-customevent-customevent

瀏覽器支援度

BCD tables only load in the browser

其他

添加額外參數

在 Internet Explorer 9 或更高的版本，你可以用以下的方法給 CustomEvent() constructor 添加額外參數

javascript

(function () {
  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;
})();