javascript - 在元素/ Canvas 元素中间创建单击事件？

我已经看过并使用了允许您在元素上创建click事件的代码，但是看来这些click事件是在元素的0,0坐标处创建的。我有一个canvas元素，我需要为其中心附近创建一个click事件。

如何在元素中心附近创建click事件？

例如，说我想单击该元素的20px，30px处：

<canvas style="width: 50px; height: 50px;">

我尝试设置鼠标事件属性clientX和clientY，但是并没有在应有的位置注册单击，因此我猜这些属性并没有达到我的预期。

最佳答案

只需查看MDN上MouseEvent的文档，即可尝试以下操作。我没有看到选择元素本身中像素的方法，但是可以使用canvas元素上getBoundingClientRect方法的结果来计算想要在窗口中的位置。

var canvasBCR = canvas.getBoundingClientRect();
canvas.dispatchEvent(new MouseEvent("click", {clientX: canvasBCR.left + 20, clientY: canvasBCR.top + 30}));

关于javascript - 在元素/ Canvas 元素中间创建单击事件？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/38470871/