javascript - 从鼠标点击捕获 X Y 坐标 (javascript)

标签 javascript

我知道这应该是问一个问题,得到一个答案(我想我正在这样做,只是不确定我的清晰度水平)。我被要求找到一种方法来捕获鼠标点击的 xy 坐标,然后将它们存储在数据库中。我想知道的是,如果一个人使用台式机、平板电脑、智能手机点击同一个地方,得到的 xy 会相同吗?我想我问的原因是我预感它们不会相同。如果是这种情况,那么我如何在以后从数据库中提取所有鼠标点击的位置时准确地映射它们。我希望我在这里说得有道理(我自己也不太确定)。

谢谢大家!

最佳答案

当您获取点击(鼠标按下或触地等)事件的 X/Y 线时,它们以屏幕左侧和顶部的像素为单位。

由于手机、平板电脑、笔记本电脑和台式机不具有相同的分辨率,因此它们不会具有相同的坐标。您可以做的是将其转换为%...假设您有一张图像并且您希望您的用户能够标记某人...那么您可以将坐标保存在%中,如下所示:

x: 35%, y: 60%

1920x1080 => x: 672px (1920/100*35), y = 648px (1080/100*60)
600x400 => x: 210px (600/100*35), y = 240px (400/100*60)
...

这就是我想尝试的。

编辑
正如@Binoy 指出的,相同的 X/Y 坐标在任何设备上都是相同的。但在移动设备上,您可能必须滚动,因为该点位于视口(viewport)之外。在我的回答中,我猜测存在某种响应式布局(例如带有 CSS max-width: 100% 的图像),并且用户正在单击它。

关于javascript - 从鼠标点击捕获 X Y 坐标 (javascript),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29379102/

相关文章:

javascript - 如何将多个可能的正则表达式值与给定字符串进行比较

javascript - NodeJs request.on 中传递的变量

javascript - AngularJS的依赖注入(inject)中 ".config([...])"中的方括号是什么意思

javascript - goRatchet 框架中的切换按钮

javascript - 类型错误 : undefined is not an object ('_this.props' )

javascript - 是否可以在 JavaScript 中编写数字 swap() 函数?

javascript - js2xmlparser 自定义 XML 正文

javascript - 传递并返回来自 javascript 和 android 的值,并用作手机间隙插件

PHP 表单客户端验证

Javascript 拆分、替换表现奇怪