一尘不染

JavaScript如何获得在画布元素上单击鼠标的坐标?

javascript

将click事件处理程序添加到canvas元素(将返回click的x和y坐标)(相对于canvas元素)的最简单方法是什么?

不需要旧版浏览器兼容性,Safari,Opera和Firefox都可以。


阅读 463

收藏
2020-04-25

共1个答案

一尘不染

这个答案很老了,它使用检查不再需要的旧浏览器,因为clientXclientY属性在所有当前浏览器中都有效。您可能想查看PatriquesAnswer,以获得更简单,最新的解决方案。

最初的答案:
正如我当时发现的一篇文章中所述,但不再存在:

var x;
var y;
if (e.pageX || e.pageY) { 
  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; 
} 
x -= gCanvasElement.offsetLeft;
y -= gCanvasElement.offsetTop;

对我来说工作得很好。

2020-04-25