EventTarget
介面定義了其實作的物件具有接收事件的能力,也可能擁有處理事件的監聽器。
除了最為常見的 Element
、Document
與 Window
繼承或實作了 EventTarget
介面之外,其它的物件還有 XMLHttpRequest
、AudioNode
、AudioContext
⋯等等。
許多 EventTarget
(包括 Element、Document 和 Window)除了透過 addEventListener()
方法外,還可藉由 DOM
物件的屬性(property)或 HTML 元素屬性(attribute)來設定事件處理器。
方法
EventTarget.addEventListener()
- 於
EventTarget
物件上註冊指定事件的監聽器。 EventTarget.removeEventListener()
- 移除
EventTarget
物件上的指定事件監聽器。 EventTarget.dispatchEvent()
- 對此
EventTarget
物件派送(dispatch)一個事件物件,也就是於此EventTarget
物件上觸發一個指定的事件物件實體。
Mozilla chrome code 的額外方法
Mozilla extensions for use by JS-implemented event targets to implement on* properties. See also WebIDL bindings.
- void setEventHandler(DOMString type, EventHandler handler)
- EventHandler getEventHandler(DOMString type)
範例
Simple implementation of EventTarget
var EventTarget = function() {
this.listeners = {};
};
EventTarget.prototype.listeners = null;
EventTarget.prototype.addEventListener = function(type, callback) {
if (!(type in this.listeners)) {
this.listeners[type] = [];
}
this.listeners[type].push(callback);
};
EventTarget.prototype.removeEventListener = function(type, callback) {
if (!(type in this.listeners)) {
return;
}
var stack = this.listeners[type];
for (var i = 0, l = stack.length; i < l; i++) {
if (stack[i] === callback){
stack.splice(i, 1);
return;
}
}
};
EventTarget.prototype.dispatchEvent = function(event) {
if (!(event.type in this.listeners)) {
return true;
}
var stack = this.listeners[event.type];
event.target = this;
for (var i = 0, l = stack.length; i < l; i++) {
stack[i].call(this, event);
}
return !event.defaultPrevented;
};
規範
Specification | Status | Comment |
---|---|---|
DOM The definition of 'EventTarget' in that specification. |
Living Standard | No change. |
Document Object Model (DOM) Level 3 Events Specification The definition of 'EventTarget' in that specification. |
Obsolete | A few parameters are now optional (listener ), or accepts the null value (useCapture ). |
Document Object Model (DOM) Level 2 Events Specification The definition of 'EventTarget' in that specification. |
Obsolete | Initial definition. |
瀏覽器相容性
We're converting our compatibility data into a machine-readable JSON format.
This compatibility table still uses the old format,
because we haven't yet converted the data it contains.
Find out how you can help!
Feature | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
---|---|---|---|---|---|---|
Basic support | 1.0 | (Yes) | 1.0 (1.7 or earlier) | 9.0 | 7 | 1.0[1] |
Feature | Android | Edge | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|---|
Basic support | 1.0 | (Yes) | 1.0 (1) | 9.0 | 6.0 | 1.0 |
[1] window.EventTarget
does not exist.
參見
- Event reference - the events available in the platform.
- Event developer guide
Event
interface