Erste assoziiert img von HTML-Bereich

Question

Es gibt zwei img Elemente, die die gleiche Karte verwenden mit einem Bereich. Nun, wir binden z.B. ein Click-Ereignishandler der Bereich Element. Ist es möglich, aus den Event-Handler, um zu bestimmen, welche Bild Instanz angeklickt wurde?

Answer 1

Ja, können Sie bestimmen, welches Bild von entweder angeklickt:

1. einen einzigen Event-Handler-Befestigung auf einem Mutterelement und Inspizieren die event.target Eigenschaft
2. Anbringen einzelner Event-Handler auf jedes Bildelement.

Zum Beispiel, wenn Sie Ihre HTML wie folgt aussieht:

<div id="container">
    <img id="myimage1" usemap="theMap" />
    <img id="myimage2" usemap="theMap" />
    <map name="theMap">
    ...
    </map>
</div>

dann die möglichen Lösungen sind:

1)

document.getElementById('container').onclick = function(evt) {
    var target = evt.target || window.event.srcElement;

    switch(target.id) {

        case 'myimage1':
            alert('you clicked on myimage1');
            break;

        case 'myimage2':
            alert('you clicked on myimage2');
            break;

        default:
            // click handler got some other evet
    }
}

2)

document.getElementById('myimage1').onclick = function() {
    alert('you clicked on myimage1');
}
document.getElementById('myimage2').onclick = function() {
    alert('you clicked on myimage2');
}

Je nachdem, was Sie tun möchten, nachdem Sie das Ereignis erfassen, werden Sie zurückkommen müssen, um entweder ‚true‘ die URL zu ermöglichen, durch zu folgen, oder ‚falsch‘ eine alternative Maßnahmen zu ergreifen.

Answer 2

Eine mögliche Lösung ist die offset Eigenschaft zu verwenden. Auf diese Weise erhalte ich die Eltern, das ist, was ich ursprünglich benötigt. das Bild zu finden, selbst sollte auch nicht allzu schwierig sein, vorausgesetzt, dass die Bilder in verschiedenen enthalten sind div s.