Question

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

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

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

但根据我的理解，这应该不起作用，因为第一个参数被期望为“事件”（不是“这个”）对象）在事件处理程序方法中如下

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

我们可以在eventHandler方法中传递任何参数（this或event），提供它们的名称是正确的还是第一个参数会总是被视为事件对象？

Answer 1

您定义了custChange，更重要的是：您正在调用它。因此，您可以自己决定应该接受哪些参数以及依次使用哪种参数。仅适用于您不调用的函数，您必须注意参数的顺序。

但是如果你想定义custChange以便它与other ways of binding event handlers兼容，即

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，Event]
[活动，选择]
未捕获的ReferenceError：未定义e

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

Answer 3

~~第一个参数将始终是事件。~~

[edit]您可以使用您想要的任何参数调用您的处理程序，调用时event和this个对象可用。 event引用事件对象，this引用触发事件的dom对象。[/ edit]

但是，在处理程序event.currentTarget中将链接回触发事件的对象：

<script>
    function custChange(event) {
        // event.currentTarget = select element
    }
</script>
<select id="customer" onchange="custChange(event);">

Answer 4

您可以根据不引人注目的javaScript执行此操作：

$("#customer").on("change", function () {
    ... and here you have $(this) object linked to 'customer' select
});

Answer 5

也许你可以这样做：

<p><a id="link" href="#">click me</a></p>
<script>
var link = document.getElementById("link");
AttachEvent(link, "click", EventHandler);
function AttachEvent(element, type, handler) {
    if (element.addEventListener) element.addEventListener(type, handler, false);
    else element.attachEvent("on"+type, handler);
}

我希望它有所帮助。

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

5 个答案: