如何使用Javascript在画布中的位置单击？

我想单击Canvas元素，其id为

myCanvas

width:500，height:200

在Javascript中，有什么方法可以做到这一点

使用

页面标尺

-Chrome扩展获取位置，包括参数

x

，

y

我尝试了以下代码：

function relMouseCoords(event){
    var totalOffsetX = 220;
    var totalOffsetY = 100;
    var canvasX = 500;
    var canvasY = 200;
    var currentElement = this;

    do{
        totalOffsetX += currentElement.offsetLeft - currentElement.scrollLeft;
        totalOffsetY += currentElement.offsetTop - currentElement.scrollTop;
    }
    while(currentElement = currentElement.offsetParent)

    canvasX = event.pageX - totalOffsetX;
    canvasY = event.pageY - totalOffsetY;
    console.log(canvasX, convastY);
    return {x:canvasX, y:canvasY}
}
HTMLCanvasElement.prototype.relMouseCoords = relMouseCoords;

---

通过JS点击任何元素都可以通过完成

使用jQuery：

x_coord = 1;
y_coord = 1;

var e = jQuery.Event( "mousedown", { pageX: x_coord, pageY: y_coord } );
$('#myCanvas').trigger(e);

// execute more code
x_coord = 255;
y_coord = 255;

var e = jQuery.Event( "mouseup", { pageX: x_coord, pageY: y_coord } );
$('#myCanvas').trigger(e);

---

嘿@semanser，我试过你的代码，但没用。您可以在上看到演示。我使用链接进行测试：如果它正常工作，它必须在画布中单击并显示任何

彩色纸屑。