我见过并使用过允许您在元素上创建单击事件的代码,但这些单击事件似乎是在元素的 0,0 坐标处创建的。我有一个 Canvas 元素,我需要在其中心附近创建一个单击事件。
如何在元素中心附近创建点击事件?
例如,我想点击该元素 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}));