// 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>

同様の質問がいくつかあります。

しかし、私のコードでは、またはなどのクリックされた子要素を取得しようとしていますaspan。

ではevent、引数としてイベントハンドラーに渡す正しい方法は何ですか？または引数を渡さずにハンドラー内でイベントを取得する方法は？

編集する

私は承知しているaddEventListenerとjQuery、にイベントを渡すためのソリューションを提供してくださいinlineイベントハンドラを。

eventオブジェクトを渡すには：

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

クリックされた子を取得するにはelement（eventパラメーターと一緒に使用する必要があります：

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

element自身を渡すには（DOMElement）：

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

jsFiddleのライブ例を見る

インラインイベントは関数として実行されるため、引数を使用するだけで済みます。

<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
}

受け入れられた回答に記載されている「イベント」は、実際には関数に渡される引数の名前です。グローバルイベントとは何の関係もありません。

を渡す必要はありません。デフォルトで自動的に渡されthisたeventオブジェクトが既に存在し、そこには元のオブジェクトが含まevent.targetれています。構文を軽くすることができます：

この：

<p onclick="doSomething()">

これで動作します：

function doSomething(){
  console.log(event);
  console.log(event.target);
}

eventオブジェクトをインスタンス化する必要はありません。すでに存在しています。やってみよう。そしてevent.target、これを呼び出すオブジェクト全体が含まれます。これは、以前「this」として参照していました。

コードのどこかから動的にdoSomething（）をトリガーすると、それeventが未定義であることがわかります。これは、クリックのイベントからトリガーされなかったためです。したがって、イベントを人為的にトリガーしたい場合は、次のように使用しますdispatchEvent。

document.getElementById('element').dispatchEvent(new CustomEvent("click", {'bubbles': true}));

その後、いつものようにdoSomething()見ていきます！eventevent.target

thisどこにでも渡す必要はありません。関数のシグネチャを配線情報から解放し、物事を簡素化できます。