获取js点击点相对被点击元素的位置,click与touch的区别

js中,获取鼠标(点击)或手势(触摸)点相对于被点击元素的所在x,y位置问题

click

dom.addEventListener('mousedown',function(e){
    console.log(e.layerX,e.layerY);
});

可以正常获取

touch

dom.addEventListener('touchstart',function(e){
    console.log(e.touches[0]);
});
//没有对应的值

该如何获取touch点相对被点击元素的位置呢?

说明一下:
clientX是相对屏幕的位置,不是被点击元素的位置:
click.clientX:https://developer.mozilla.org/zh-CN/docs/Web/API/MouseEvent/clientX
touch.clientX:https://developer.mozilla.org/zh-CN/docs/Web/API/Touch/clientX
pageX 相对于整个html文档的坐标https://developer.mozilla.org/zh-CN/docs/Web/API/Touch/pageX

阅读 9.5k
1 个回答

直接使用event.clientX是不起作用的,要使用event.changedTouches[0].clientX才好,

如果是jQuery的event对象,使用event.originalEvent.changedTouches[0].clientX。

测试

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题