Javascript：如何引用拥有事件处理程序的对象？

Question

我有一个包含图像缩略图的页面，每个缩略图都有一个onclick事件。

<a href='javascript:void(0)' onclick='getInfo();'>
  <img src='album/123.jpg' width='200' height='150' alt='' />
</a>     
<a href='javascript:void(0)' onclick='getInfo();'>
  <img src='album/456.jpg' width='240' height='320' alt='' />
</a>  

在事件处理程序getInfo()我想获取单击的图像的信息，例如源文件名或高度。 我怎样才能做到这一点？ （我希望使用this ，但这似乎是指窗口，而不是<a>标记。）
我还没有使用jquery，所以我希望得到一个纯JavaScript的答案。

Answer 1

只是这样做：

onclick='getInfo(this);'> ...

那么您可以在方法本身中获取引用

或者您可以这样做：

onclick='getInfo(event);' //我认为IE不会发送-但Chrome可以。

在该函数中，您可以获得Target 。

通过事件：

function getInfo (evt)
{
 evt.target...
}

通过这个：

function getInfo (that)
{
   do something with that....
}

Answer 2

http://jsfiddle.net/Xrzs3/

<a href='#'>
  <img src='http://www.vectortemplates.com/raster/batman-logo-big.gif'
       width='40px' height='40px' />
</a>

负载

var a=document.getElementsByTagName("a");

for(var i=0;i<a.length;i++){
   a[i].addEventListener("click", function(e){
   var img=e.target;
   var src=img.src;
   alert("image source = "+src);
   }, false);
}

Answer 3

尝试这个：

function getInfo() { 
        var owner = (window.event.target) ? window.event.target  : window.event.srcElement;
        // rest of your code
    }