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

คุณสามารถระบุชื่อของข้อมูลeventดังกล่าวข้างต้น แต่อีกทางหนึ่งตัวจัดการของคุณสามารถเข้าถึงeventพารามิเตอร์ตามที่อธิบายไว้ที่นี่ : "เมื่อตัวจัดการเหตุการณ์ถูกระบุเป็นแอตทริบิวต์ HTML รหัสที่ระบุจะรวมอยู่ในฟังก์ชันที่มีพารามิเตอร์ต่อไปนี้" มีเอกสารเพิ่มเติมอีกมากมายที่ลิงค์

เนื่องจากเหตุการณ์แบบอินไลน์ถูกเรียกใช้เป็นฟังก์ชันคุณจึงสามารถใช้อาร์กิวเมนต์ได้

<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()จะเห็นeventและevent.targetตามปกติ!

ไม่จำเป็นต้องผ่านไปthisทุกที่และคุณสามารถรักษาลายเซ็นฟังก์ชันของคุณให้ปราศจากข้อมูลการเดินสายและทำให้สิ่งต่างๆง่ายขึ้น