將點擊事件分配給Image對象

Question

我正在使用JavaScript進行工作，並且嘗試單擊一個對象並進行一些簡單的操作，例如發出警報。

所以我聲明了這樣的對象：

var panel = new Image();
panel.src = IMAGES_PATH + "panel.png";

然后，將其繪制到屏幕上。

ctx.drawImage(panel, 475, 140);

我現在面臨的問題是我想單擊它，並且要觸發一個函數。

嘗試＃1

panel.onclick = function () {
    alert("You clicked!");
}

嘗試＃2

panel.addEventListener('click', function ()
{
    alert('blah');
}, false);

我知道點擊事件可在Google Chrome瀏覽器中運行，因為我可以這樣做：

window.addEventListener("click", click, false);

關於為什么我不能對Image類進行onclick的任何想法？

Answer 1

感謝您的建議，我決定通過獲取鼠標在畫布上的x和y位置並找出可以單擊以觸發事件的位置來完成此操作。

Answer 2

看起來您正在使用畫布繪制形狀。 現在有一種方法可以為畫布上的對象注冊單擊事件。

請參考這篇文章以獲得一些好的建議

畫布圖像和Click事件