在onChange事件中传递此对象作为参数？

Question

我想创建一个将"this"对象作为参数传递的eventHandler.我试过这个

 <select id="customer" onchange="custChange(this);">

它工作正常,并获得甚至被调用的dom对象.

但根据我的理解,这应该不起作用,因为第一个参数被期望作为事件处理程序方法中的"事件"(不是"this"对象),如下所示

  <select id="customer" onchange="custChange(event);">

我们可以在eventHandler方法中传递任何参数(this或event)提供它们的名称是正确的还是第一个参数将始终被视为事件对象？

Answer 1

你定义了custChange,更重要的是:你在调用它.因此,您可以自己决定应该接受哪些参数以及依次使用哪种参数.仅对于未被您调用的函数,您必须注意参数的顺序.

但是如果你想定义custChange它以便与其他 绑定事件处理程序的方式兼容,即

function custChange(event) {
    // `this` refers to the DOM element
}

然后你可以用它来调用它

custChange.call(this, event);

Answer 2

我做了一个测试。

function change(){
    console.info( arguments );
}

<select name="" id="" onchange="change( this, event )">
    <option value="1">A</option>
    <option value="2">B</option>
    <option value="3">C</option>
</select>

<select name="" id="" onchange="change( event, this )">
    <option value="1">A</option>
    <option value="2">B</option>
    <option value="3">C</option>
</select>

<select name="" id="" onchange="change( this, e )">
    <option value="1">A</option>
    <option value="2">B</option>
    <option value="3">C</option>
</select>

我一一操作了上面的select，然后得到了下面的控制台信息：

• [选择，事件]
• [事件，选择]
• 未捕获的 ReferenceError：e 未定义

所以，从结果中，我得出结论，我们必须在页面调用中传递正确的单词，并且可以改变它们的位置。