如何在Image Map Mouse Over中获取Image的ID

Question

假设您有两张图像使用相同的图像映射。

<img src="/test/image1.jpg" id="image1" useMap="map-name">
<img src="/test/image2.jpg" id="image2" useMap="map-name">

<map name="map-name">
  <area shape="rect" coords="0,0,82,126" alt="Sun" onmouseover="testFunction();"/>
  <area shape="circle" coords="90,58,3"  alt="Mercury" onmouseover="testFunction();"/>
  <area shape="circle" coords="124,58,8" alt="Venus" onmouseover="testFunction();"/>
</map>

有没有办法在testFunction（）中获取图像的ID（在这种情况下为image1 | image2）？

Answer 1

是。最简单的方法是使用像jQuery这样的库来挂接事件，而不是使用onmouseover。如果你这样做，你基本上会做类似的事情：

$("AREA").mouseOver(function (e) {
  var id = $(e.target).attr("id");
}

如果你不这样做那么...在你的testFunction定义中使用“this”，并祝你好运（因为你将能够处理跨浏览器不兼容的乐趣）。