在img中调用onclick？

Question

我有几个拇指指甲,我想点击它,并在缩略图上弹出一个更大的版本.我有我正在使用的代码,如果我在标签中将其设置为链接,它可以工作,但我似乎无法使thumbanail img本身可以使用

HTML,链接有效

 <li><a href="#" onclick="toggle('widget1')">Toggle</a></li>

的javaScript

function toggle(id) {
  var e = document.getElementById(id);

  if (e.style.display == '')
    e.style.display = 'none';
  else
    e.style.display = '';
}

HTML图像我想点击这里是我尝试过的

<div id="wid1"><a href="#" onclick="toggle('widget1')"><img src="widLayOut1.jpg"   
height="200" width="200" /></a></div>

其余的HTML

<div id="widget1" style="display:none"><img src="widget1.jpg" /></div>
enter code here

思考

Answer 1

您应该能够像任何其他元素一样向图像添加点击事件.首先添加一个id

<img id="yourImg" src="widLayOut1.jpg"

然后

document.getElementById("yourImg").addEventListener("click", function(){
    alert("You clicked the image");
});

当然,如果你想支持旧的浏览器,你还需要做更多的工作

var img = document.getElementById("yourImg");

if (img.addEventListener)
    img.addEventListener("click", function(){
        alert("You clicked the image");
    });
else if (img.attachEvent)
    img.attachEvent("onclick", function(){
        alert("You clicked the image");
    });
 else 
     alert("What are you using?!");  

编辑

我在想以上

document.getElementById("yourImg").onclick = function() {
    alert("You clicked the image");
};

应该工作得很好.谢谢mplungjan