首先要獲取點(diǎn)擊發(fā)生鼠標(biāo)所在的坐標(biāo)然后判斷這個(gè)坐標(biāo)是否在圖形的范圍內(nèi)如果在，剛可以視為點(diǎn)擊了該圖形圖形本身是不能響應(yīng)事件的必須用canvas代理只是要判斷的情況有時(shí)候很復(fù)雜如果這個(gè)點(diǎn)所在的位置有多個(gè)圖形這就。

首先監(jiān)聽鼠標(biāo)mousedown事件，等事件發(fā)生之后，再監(jiān)聽鼠標(biāo)mousemove事件和mouseup事件 mousemove事件發(fā)生之后，獲得鼠標(biāo)移動(dòng)的位移，相應(yīng)的圖片的位置改變多少 mouseup事件發(fā)生之后，取消對(duì)mousemove以及mouseup事件監(jiān)聽 canvasonmousedown=。

我覺得html5是最新一代的超文本標(biāo)記語(yǔ)言，我對(duì)這個(gè)應(yīng)用很有感觸，平時(shí)做這個(gè)工作就已經(jīng)很順手了，現(xiàn)在要介紹它的優(yōu)點(diǎn)，必須要到位啊HTML5Canvas實(shí)現(xiàn)各種炫酷的儀表盤動(dòng)畫 儀表盤包括指南針里程表體溫計(jì)等，你可以通過(guò)。

1，添加事件監(jiān)聽，比如說(shuō)，鼠標(biāo)按下 做什么，滑動(dòng) 做什么，彈起做什么一般鼠標(biāo)事件都是判斷彈起的位置 2，判斷有效坐標(biāo)，在事件中判斷坐標(biāo)位置是否在圖片位置，也就是圖片在canvas的位置exsome codecanvaswidth=400ca。

基本思路是給Canvas元素綁定事件，當(dāng)事件發(fā)生時(shí)，檢查事件對(duì)象的位置，然后檢查哪些圖形覆蓋了該位置比如上面的例子里畫過(guò)一個(gè)矩形，該矩形覆蓋x軸10110y軸10110的范圍只要鼠標(biāo)點(diǎn)擊在這個(gè)范圍里，就可以視為點(diǎn)擊了。

研究人員指出“Canvas指紋是瀏覽器指紋的最近研究成果，還沒有被公開報(bào)道過(guò)我們的調(diào)查結(jié)果得出排名前的網(wǎng)站中5%都使用了這種技術(shù)HTML5 canvas不僅局限于圖片處理，它還能監(jiān)聽用戶的鍵盤輸入鼠標(biāo)移動(dòng)以及觸摸事件。