Как получить идентификатор изображения на карте изображения при наведении курсора мыши

Допустим, у вас есть два изображения, которые используют одну и ту же карту изображений.

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

Есть ли способ получить идентификатор изображения (в данном случае image1|image2) внутри функции testFunction()?


javascript jquery imagemap
person user234882    schedule 18.12.2009    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Да. Самый простой способ — использовать библиотеку, например jQuery, для подключения события вместо использования onmouseover. Если вы сделаете это, вы в основном сделаете что-то вроде:

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

Если вы этого не сделаете, тогда... хорошо поиграйте с "этим" внутри вашего определения testFunction и удачи (потому что вы столкнетесь с радостью кросс-браузерной несовместимости).

person machineghost    schedule 18.12.2009
comment
-1 вы пробовали это решение? #1 Нет getTarget() ни в jQuery, ни в самом объекте DOM Event. - person jitter; 19.12.2009
comment
getTarget() отсутствует, но в объекте события есть свойства e.target, e.currentTarget и e.relatedTarget. Это то, что вы имеете в виду? Если да, то эти свойства дают ошибочные результаты — иногда возвращается идентификатор «области», а иногда — идентификатор изображения. Кто-нибудь получил какие-либо другие предложения или вы можете уточнить, что вы собирались использовать для machineghost? Спасибо за ваш оригинальный ответ. - person user234882; 20.12.2009
comment
Упс; не знаю, откуда я взял getTarget()... sigh ... но да, я имел в виду e.target и e.currentTarget. Я исправлю ответ. Что касается несоответствия, то оно кажется странным. Можете ли вы определить какой-либо шаблон, когда он возвращает идентификатор карты изображения по сравнению с областью? - person machineghost; 20.12.2009
comment
Одна мысль, которая может помочь устранить несоответствие, состоит в том, чтобы попытаться использовать немного другие события (mouseenter или mouseleave), как показано здесь: stackoverflow.com/questions/1201052/ - person machineghost; 20.12.2009