javascript js中的事件关键字
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4968194/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Event keyword in js
提问by Dan
I found this code worling in chrome, ff and ie. However, I can't find any references to the "magic" eventkeyword in the web. See this
我在 chrome、ff 和 ie 中发现了这段代码。但是，我event在网上找不到任何对“magic”关键字的引用。看到这个
<html>
<head>
<script type="text/javascript">
function handler(e)
{
alert(e);
}
</script>
</head>
<body>
<h1 onclick="handler(event);alert(0)">Click on this text</h1>
</body>
</html>
This scripts STOPS working if I change eventin brackets to something else. Is that a deprecated keyword?
如果我将event括号更改为其他内容，此脚本将停止工作。这是一个已弃用的关键字吗？
回答by Felix Kling
The Eventobjectis automatically passed to all event handlers. If you add event handlers with addEventListener, you can choose the parameter name (like you did in handler). But for code attached with the onclickattribute, you can only access the event object via the implicit variable event.
该Event对象会自动传递给所有事件处理程序。如果您使用 来添加事件处理程序addEventListener，您可以选择参数名称（就像您在 中所做的那样handler）。但是对于带有onclick属性的代码，您只能通过隐式变量访问事件对象event。
If you want to know more about event handling in general, I suggest to read about it at quirksmode.org.
如果您想了解更多关于一般事件处理的信息，我建议您在quirksmode.org阅读它。
Also have a look at MDC - Event handlers:
也看看MDC - 事件处理程序：
These are properties that correspond to the HTML 'on' event attributes.
Unlike the corresponding attributes, the values of these properties are functions (or any other object implementing the EventListener interface) rather than a string. In fact, assigning an event attribute in HTML creates a wrapper function around the specified code. For example, given the following HTML:
<div onclick="foo();">click me!</div>If
elementis a reference to thisdiv, the value ofelement.onclickis effectively:function onclick(event) { foo(); }Note how the event object is passed as parameter
eventto this wrapper function.
这些是对应于 HTML 'on' 事件属性的属性。
与相应的属性不同，这些属性的值是函数（或任何其他实现 EventListener 接口的对象）而不是字符串。事实上，在 HTML 中分配事件属性会创建一个围绕指定代码的包装函数。例如，给定以下 HTML：
<div onclick="foo();">click me!</div>如果
element是对 this 的引用div，则 的值element.onclick实际上是：function onclick(event) { foo(); }注意事件对象是如何作为参数传递
event给这个包装函数的。
回答by Andy E
When an event attribute is set, an implicit Function is created with eventas the first argument. When the event fires, the event object is passed to that function. There wasn't a solid definition on this behavior until HTML 5 (which is still a draft), but it's been this way for a long time in the major browsers and that's how it made it into the spec:
设置事件属性后，将创建一个隐式函数event作为第一个参数。当事件触发时，事件对象被传递给该函数。直到 HTML 5（仍然是草案）才对这种行为进行明确定义，但在主要浏览器中这种方式已经存在很长时间了，这就是它如何进入规范的方式：
When an event handler's Function object is invoked, its
call()callback must be invoked with one argument, set to theEventobject of the event in question.
当调用事件处理程序的 Function 对象时，
call()必须使用一个参数调用其回调，该参数设置为Event相关事件的对象。
That argument is aptly named eventfor obvious reasons. http://www.w3.org/TR/html5/webappapis.html#events
event出于显而易见的原因，这个论点被恰当地命名。 http://www.w3.org/TR/html5/webappapis.html#events
回答by Dominic Cerisano
This really threw me. The following 'typo' works in Chromium, but not FF:
这真的让我很失望。以下“错字”适用于 Chromium，但不适用于 FF：
some_worker.onmessage = function(e) {
// do stuff
if (e.data instanceof ArrayBuffer)
intArray = new Uint8Array(event.data);
// do other stuff
};
Chromium was observing the implicit keyword for 'event' but FF threw an 'undefined variable' error! Just changed 'event' to 'e' and all is well.
Chromium 正在观察“事件”的隐式关键字，但 FF 抛出了“未定义的变量”错误！只是将“事件”更改为“e”，一切都很好。
I notice that even stackoverflow's code markup observes 'event' as an implicit keyword ... not to knock FF, since it detected the typo.
我注意到即使是 stackoverflow 的代码标记也将“事件”视为一个隐式关键字……不要敲打 FF，因为它检测到了拼写错误。
回答by John Louros
I guess your are trying to pass the clicked HTML element to your handler()function. The correct way to do that i your code is:
<h1 onclick="handler(this);">Click on this text</h1>
我猜您正试图将单击的 HTML 元素传递给您的handler()函数。正确的方法是：
<h1 onclick="handler(this);">Click on this text</h1>
However I strongly recommend avoid this approach. Avoid having styling and behavior defined on the HTML. Please read the following article: Unobtrusive JavaScript
但是我强烈建议避免这种方法。避免在 HTML 上定义样式和行为。请阅读以下文章： Unobtrusive JavaScript
