點擊事件畫布/ javascript

Question

大家好，我想讓我的矩形可點擊。 工作之后，我大聲說，當我單擊一個矩形時，它會在div中顯示數據。 目前，畫布div中的數據是手動的。 是否可以使用腳本執行我想做的事情，還是應該再次啟動但完全不同？

for (var i = 0; i < rects.length; i++) {
    if (x > rects[i][0] && x < rects[i][0] + rects[i][2] && y > rects[i][1] && y < rects[i][1] + rects[i][3]) 
    {
        alert('Rectangle ' + i + ' clicked');
    }
}

這就是我所擁有的。 我不知道如何將警報更改為我想要的內容。

（對於整個html頁面）

http://fiddle.jshell.net/f6rLds4g/

Answer 1

在DIV上設置innerHTML將起作用：

for (var i = 0; i < rects.length; i++) {
    if (x > rects[i][0] && x < rects[i][0] + rects[i][2] && y > rects[i][1] && y < rects[i][1] + rects[i][3]) {
        var container = document.createElement("span");
        span.innerHTML = 'Rectangle ' + i + ' clicked';
        document.getElementById("Display").appendChild(span);
    }
}