javascript - 浏览器如何处理内联 javascript 事件？

Question

我需要将事件对象和事件源对象传递给处理函数。我相信我了解外部 javascript 的工作原理:

<input id="input2"/>
<script>
function getKey2(e) { alert(this.id+e.keyCode); }
document.getElementById("input2").onkeypress = getKey2;
</script>

onkeypress 方法是在 input2 DOM 上定义的，所以 this 指向它，事件对象作为第一个参数传递给函数。但我对内联javascript感到困惑:

<input id="input1" onkeypress="getKey1(this,event)"/>
<script>
function getKey1(obj,e) {
    alert(obj.id+e.keyCode);
}
</script>

第一个参数this应该是Window对象，但是当它被复制到事件上的obj时，它就是事件源对象，来自 DOM 的 input1。第二个参数，event，应该是全局事件对象，但是当被调用时，事件对象被传递给函数。显然，我的推论是错误的 - 这个调用是如何工作的？

长话短说:为什么以下字符中的对象值不相同？

              | name   object value
----------------------------------
in onkeypress | this   Window
in getKey1    | obj    DOM input1


              | name   object value
----------------------------------
in onkeypress | event  global event
in getKey1    | e      keypress event

fiddle here

Answer 1

W3C DOM 规范规定了两种内联事件绑定(bind):

1. this 绑定(bind)到定义内联事件的元素；
2. 引入了一个名为event 的局部变量。 (IE 不这样做，但相同的语法适用于内联事件，因为 event 在 IE 中将被视为 window.event。)

在 HTML5 中，信息被隐藏在 6.1.6.1 Event handlers 下.两部分展开:

When an event handler content attribute is set [that is, when an inline event is set] .. Let body [of the synthesized function declaration] be the event handler content attribute's new value .. Let the function have a single argument called event. [Note that onerror is a special.]

..Let Scope [or this] be the result of NewObjectEnvironment(the element's object, Scope). [This is chained with other environment contexts such as the Form (if it exists) and the Global Context.]