对象如何在JavaScript中实现Event接口
[英]How can an object implements the Event interface in JavaScript
问题描述
In this .addEventListener in MDN 
在此MDN中的.addEventListener中
listener
The object that receives a notification (an object that implements the Event interface) when an event of the specified type occurs.
It says we can use an object that implements the Event interface as listener for the event. 它表示我们可以使用an object that implements the Event interface作为an object that implements the Event interface侦听器。
But I can't find how can object to implement the Event interface. 但是我找不到如何实现事件接口的对象。 As I tried: 当我尝试：
document.querySelector('#demo').addEventListener('click', { handleEvent: function (e) { console.log(e) } }, false)
#demo { height: 200px; background: #ccc; }
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <div id="demo"></div> </body> </html>
This one can handle click event right. 这个可以正确处理点击事件。
Maybe you can give me some documents about this. 也许您可以给我一些有关此的文件。
1 个解决方案
解决方案1
3 已采纳 2016-11-01 04:33:27
callback interface EventListener {
void handleEvent(Event event);
};
is described at IDL Index , which links to 3.6. 在IDL索引中进行了描述，该索引链接到3.6。 Interface EventTarget , mentioned again at 3.8. 接口EventTarget ，在3.8再次提到。 Dispatching events 调度事件
To inner invoke an object with event, run these steps: Call a user object's operation with listener's callback, "
handleEvent", a list of arguments consisting of event, and event's currentTarget attribute value as the callback this value.handleEvent”，由事件组成的参数列表以及事件的currentTarget属性值作为回调此值的方式调用用户对象的操作 。 If this throws an exception, report the exception.An event listener can be used to observe a specific event.
An event listener consists of these fields:
- type (a string)
- callback (an EventListener)
- capture (a boolean, initially false)
- passive (a boolean, initially false)
- once (a boolean, initially false)
- removed (a boolean for bookkeeping purposes, initially false)
Although callback is an EventListener , as can be seen from the fields above, an event listener is a broader concept.
which references back to the EventListener object where handleEvent is the only named property. 它引用回EventListener对象，其中handleEvent是唯一的命名属性。
callback interface EventListener {
void handleEvent(Event event);
}
The definition of
EventListeneras a callback interface is an example of an existing API that needs to allow user objects with a given property (in this case "handleEvent") to be considered to implement the interface.EventListener定义为回调接口是现有API的示例，该API需要允许考虑具有给定属性的用户对象（在这种情况下为“handleEvent”）来实现该接口。 For new APIs, and those for which there are no compatibility concerns, using a callback function will allow only a Function object (in the ECMAScript language binding).
A callback interface is an interface that uses the callback keyword at the start of its definition.
callback interface identifier { /* interface_members... */ };2.10.
User objects are those that authors would create, implementing callback interfaces that the Web APIs use to be able to invoke author-defined operations or to send and receive values to the author's program through manipulating the object's attributes.
Note that user objects can only implement callback interfaces and platform objects can only implement non-callback interfaces.
For example 例如
document.querySelector('#demo').addEventListener('click', {
abc: function (e) {
console.log(e)
}
}, false)
does not dispatch event to abc handler. 不会将事件调度到abc处理程序。 Though handleEvent identifier does dispatch event. 虽然handleEvent标识符确实调度事件。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.