Javascript-當用戶單擊Facebook中的圖像時如何收聽？

Question

我想知道一種有效的方法，當用戶單擊Facebook新聞訂閱源上的圖像以執行某些操作時，該函數就會觸發。

我可以為每個圖像添加一個偵聽器，但這不是很有效。 還有其他方法嗎？

Answer 1

這樣的事情怎么樣： http : //jsfiddle.net/c24w/DJ2ax/4/

的HTML

<div id="newsfeed">
    <img src="http://i46.tinypic.com/2cos8hw.png" id="1">
    <img src="http://i46.tinypic.com/2cos8hw.png" id="2">
    <img src="http://i46.tinypic.com/2cos8hw.png" id="3">
    <div><a href="#">Something else clickable</a></div>
</div>

的JavaScript

var newsfeed = document.getElementById('newsfeed');

newsfeed.onclick = function handleNewsfeedClick(e) {
    var el = e.srcElement;
    if (el.tagName === 'IMG') {
        console.log('Clicked image ' + el.id);
    }
};

這是將click事件偵聽器附加到新聞源 。 單擊新聞源的子元素時，事件將傳播到新聞源，並被其單擊偵聽器捕獲。 然后，您檢查click事件的源是否是圖像。

輸出到瀏覽器的控制台。 （我在Chrome中進行了簡短的測試。）