изображение карта ассоциируется с более чем одно изображение

Question

Скажем, есть несколько одинаковых изображений на странице, все связанные с одной и той же карте:

<img id="img1" usemap="#my-map" .... > 
<img id="img2" usemap="#my-map" .... > 
<img id="img3" usemap="#my-map" .... > 

<map name="my-map"> 
    <area .... coords=... class="foo"> 
    <area .... coords=... class="bar"> 
</map> 

Существует Mouseover EventHandler на каждой области.

Fom в пределах этих районов eventhandlers наведения мыши, то есть ссылки только переменные, которые являются локальными для события наведения мыши района, никаких глобальных переменных, не возможно знать, какой образ мыши на? Есть ли какие-то временные отношения, которые подвергаются DOM, поэтому обработчик событий наводки области может ответить на вопрос «Какое изображение я собираю в данный момент?»

Просьба исключить прикрепление обработчиков непосредственно к изображениям. Я не пытаюсь решить проблему, но я пытаюсь выяснить, что, если что-нибудь, может быть известно внутри обработчика событий mouseover события вокруг текущего или «горячего» изображения.

Thanks

Answer 1

Вы можете использовать что-то подобное, чтобы найти идентификатор.

$('area').bind('mouseover',function(e) { 
    alert(e.fromElement.id); // will alert the ID of the image 
})​; 

Там тонна больше информации вы можете получить от fromElement, таких как СРК, outerHTML и т.д. Лучше всего использовать console.log (е); и выкалывать с помощью того, что он сбрасывает в консоль с помощью Google Chrome или Firebug в Firefox.

EDIT Этот подход непостоянный в лучшем случае и на него нельзя положиться. То, что доступно в e, по-видимому, определяется тем, к чему вы привязываетесь, и к какой функции вы получаете e (щелчок, курсор мыши и т. Д.).