Немного о HTML5

Вопрос в том, как добавить сюда событие onclick?

The next step is to take the MouseEvent object and calculate which square on the Halma board just got clicked. The Halma board takes up the entire canvas, so every click is somewhere on the board. We just need to figure out where. This is tricky, because mouse events are implemented differently in just about every browser.
function getCursorPosition(e) {
var x;
var y;
if (e.pageX != undefined && e.pageY != undefined) {
x = e.pageX;
y = e.pageY;
}
else {
x = e.clientX + document.body.scrollLeft +
document.documentElement.scrollLeft;
y = e.clientY + document.body.scrollTop +
document.documentElement.scrollTop;
}

At this point, we have x and y coordinates that are relative to the document (that is, the entire HTML page). That’s not quite useful yet. We want coordinates relative to the canvas.

x -= gCanvasElement.offsetLeft;
y -= gCanvasElement.offsetTop;

Now we have x and y coordinates that are relative to the canvas. That is, if x is 0 and y is 0 at this point, we know that the user just clicked the top-left pixel of the canvas.