如何将事件作为参数传递给JavaScript中的内联事件处理程序？编辑

javascript event-handling events parameter-passing inline

2022-08-30 02:20:39

// this e works
document.getElementById("p").oncontextmenu = function(e) {
    e = e || window.event;
    var target = e.target || e.srcElement;
    console.log(target);
};

// this e is undefined
function doSomething(e) {
    e = e || window.event;
    var target = e.target || e.srcElement;
    console.log(target);
}

<p id="p" onclick="doSomething(e)">
    <a href="#">foo</a>
    <span>bar</span>
</p>

已经提出了一些类似的问题。

但是在我的代码中，我试图获取被点击的子元素，比如一个或 span。

那么，将参数传递给事件处理程序的正确方法是什么，或者如何在不传递参数的情况下在处理程序中获取事件？event

编辑

我知道和，请提供将事件传递到事件处理者的解决方案。addEventListenerjQueryinline

答案 1

传递对象：event

<p id="p" onclick="doSomething(event)">

以获取单击的子项（应与参数一起使用：elementevent

function doSomething(e) {
    e = e || window.event;
    var target = e.target || e.srcElement;
    console.log(target);
}

传递自身（DOMElement）：element

<p id="p" onclick="doThing(this)">

在 jsFiddle 上查看实时示例。

您可以指定上述名称，但您的处理程序也可以访问参数，如下所述：“当事件处理程序被指定为 HTML 属性时，指定的代码将包装到具有以下参数的函数中”。链接中还有更多其他文档。eventevent

答案 2

由于内联事件作为函数执行，因此只需使用参数即可。

<p id="p" onclick="doSomething.apply(this, arguments)">

和

function doSomething(e) {
  if (!e) e = window.event;
  // 'e' is the event.
  // 'this' is the P element
}

在接受的答案中提到的“事件”实际上是传递给函数的参数的名称。它与全球事件无关。