Javascript 如何获得触摸事件点相对于目标元素的x坐标？

所以我有一张像这样的图片：

var elem=document.getElementByIdbt； elem.addEventListenertouchstart、handleStart、false； 功能手柄{ e、 防止违约； var touch=e.targettouchs[0]； X=touch.pageX； Y=touch.pageY； 返回[X，Y]； }

---

将图像位置设置为绝对，并将其开始坐标设置为左上角

#bt{
  position:absolute;
  left:0px;
  top:0px;
}

现在，触摸坐标是图像像素坐标。您可能需要考虑可用的页面大小、窗口大小和比例

此外，还可以通过以下方式获取元素坐标：

var rect = elem.getBoundingClientRect();
console.log(rect.top, rect.right, rect.bottom, rect.left);

---

然后您可以使用这些值，如touch.x-rect.left等。

您可以使用Jquery轻松实现这一点。在我的代码中，我使用的是单击事件，因为我使用的是桌面，但您可以替换单击事件

代码如下：

$'.clickable'.bind'click'，functionev{ var$div=$ev.target； var$display=$div.find'.display'； var offset=$div.offset； var x=ev.clientX-offset.left； var y=ev.clientY-offset.top； $display.text'x:'+x+'，y:'+y； }; .可点击{ 边框：1px实心333； 背景：eee； 高度：200px； 宽度：200px； 利润率：15px； 位置：绝对位置； } .展示{ 显示：块； 高度：16px； 位置：绝对位置； 文本对齐：居中； 垂直对齐：中间对齐； 宽度：100%； 最高：50%； 利润上限：-8px； }

---

获取触摸事件相对于图像的x和y坐标是什么意思？我的意思是图像顶部的y=0和左侧的x=0，但如果我在页面顶部有一个标题，这是唯一的方法吗？