HTML5 canvas nhấp chuột kiện

Question

tôi đã thực hiện một loạt các hình vuông

ctx.fillStyle = "rgb(0,0,0)"; 
for(x=0;x<=25;x++){ 
    for(y=0;y<=25;y++){ 
     ctx.fillRect(x, y, 20, 20); 
    } 
} 

và tôi muốn có một hình vuông để thay đổi màu sắc của nó khi nhấp vào. Làm thế nào tôi có thể làm điều đó?

Tôi không biết nhiều HTML5 và cần trợ giúp. Cảm ơn.

Answer 1

Sử dụng jQuery:

tiên, chúng ta xác định tế bào được nhấp, sau đó bạn có thể chỉ cần vẽ trên đó hình chữ nhật với một màu khác nhau:

$("#canvas").click(function(e){ 

    var x = Math.floor((e.pageX-$("#canvas").offset().left)/20); 
    var y = Math.floor((e.pageY-$("#canvas").offset().top)/20); 
    ctx.fillStyle = "rgb(255,255,255)"; 
    ctx.fillRect(x*20, y*20, 20, 20); 


}); 

Answer 2

này beta build bởi Caleb Evans có thể giúp đỡ. kiện sau đây được bao gồm ...

• nhấp chuột
• dblclick
• mousedown
• mouseup
• MouseMove

liên kết để giới thiệu về jsFiddle.