get click event of each rectangle inside canvas?

Question

I dont know how to register click event on each rectangle.

here is the sample:

http://jsfiddle.net/9WWqG/1/

Answer 1

Please use below function if you want to support more than one rectangle in canvas and handle its click event..... modified logic given by Matt King.

    function collides(myRect, x, y) {
    var isCollision = false;
    for (var i = 0, len = myRect.length; i < len; i++) {
        var left = myRect[i].x, right = myRect[i].x+myRect[i].w;
        var top = myRect[i].y, bottom = myRect[i].y+myRect[i].h;
       if ((left + right) >= x
            && left <= x
            && (top +bottom) >= y
            && top <= y) {
            isCollision = json.Major[i];
        }
        }
    }
    return isCollision;
}