CustomEvent()
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
CustomEvent()
constructor 可用來建立 CustomEvent
物件。
語法
javascript
new CustomEvent(type);
new CustomEvent(type, options);
參數
type
-
一個
DOMString
用來表示事件名稱。 options
選擇性-
一個繼承自
Event()
的參數,其類型為 object。它有以下參數detail
選擇性-
用來表示事件相關的資訊。它能藉由
CustomEvent.detail
屬性來取得值。 其默認值為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 # 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;
})();