如何在事件處理程序中獲取javascript事件對象？

Question

我有一個帶有onclick參數的div：

<div onclick="some_function()"></div>

如何訪問函數內的事件對象？ 我需要它來獲取event.target

function some_function() 
{
event = event || window.event;
var target = event.target || event.srcElement;
//does not work in IE and Firefox, but works in chrome
}

Answer 1

這條路：

<div onclick="some_function(event)"></div>

function some_function(evt) 
{
    // do something with evt (the event passed in the function call)
}

注意，參數名稱必須是函數調用中的event 。 在事件處理程序中，您可以使用所需的名稱。

一個實時示例： http : //jsfiddle.net/davidbuzatto/KHyAb/

Answer 2

使用事件到達目標。 當心目標與currentTarget問題：

https://developer.mozilla.org/zh-CN/docs/Web/API/Event/currentTarget

   <div onclick="some_function(event)"></div>

   function some_function(event) 
   {
       // event.target is the DOM element that triggered the event
   }

Answer 3

使用事件和這兩者

 document.querySelector("div").addEventListener("click", function(event) { some_function(event, this); }, false); function some_function(currentEvent, currentObject) { alert("Object is: " + currentObject.nodeName); alert("Event is: " + currentEvent.type); }; 

 <div>Click Me</div> 

Answer 4

<div onclick="some_function(this, event)"></div>
function some_function(elem, e) 
{
    //You have both: html element (elem), and object event (e)
    //elem is not always equal to e.target
}

<div onclick="alert(this === event.target);">click here <span>then here</span></div>

Answer 5

如果我們使用事件偵聽器，則在“ this”中有html元素，在“ event”中有事件對象。

<a id="mya" href="#">Link</a>
var myA= document.querySelector("#mya");
myA.addEventListener("click", some_function);
function some_funtion() {
  //Here the html element is: this
  //Here the event object is: event
  //event.target is not always equal to this
}
<div id="mydiv">click here <span>then here</span></div>
var myDiv = document.querySelector("#mydiv");
myDiv.addEventListener("click", other_function);
function other_function() {
    alert(this === event.target);
}