如何从 MSPointerMove 事件中获取指针的当前位置？

Posted 2023-02-24

【中文标题】如何从 MSPointerMove 事件中获取指针的当前位置？

【英文标题】：How do I get the pointer's current position from the MSPointerMove event?

【发布时间】：2014-12-04 15:58:53

【问题描述】：

目前，我正在尝试为应该可以在一定范围内拖动的 html 元素实现触摸支持。它可以在使用 touchmove 的 android 和 ios 平板电脑上运行，但还不能在 Windows 平板电脑上的 IE 10 上运行。我设法捕获了 MSPointerMove 事件，我认为应该有 pageX 和 pageY 属性，但是当我 console.log 这些时，我得到 undefined。使用手势事件不是一个选项，因为我需要知道它在轴上拖了多远。

那么，我应该寻找哪些属性？

【参考方案1】：

我不确定 HTML 页面是如何显示的，但请输入style="-ms-touch-action: none"。这可能是因为 mousemove 事件的默认设置是拖动屏幕，而不是注册移动鼠标。

【讨论】：

不幸的是，我已经应用了这种风格——这解决了事件根本没有被触发的问题。现在，它被触发了，但即使使用这种样式，它似乎也不包含坐标。

【参考方案2】：

不幸的是，我的问题似乎没有包含足够的详细信息来包含实际问题 - 我可以测试的平板电脑无法访问互联网，因此我无法提供 JSFiddle 来演示该问题。

所以问题是我使用的是 Angular，它使用 jQuery 的一种形式来包装事件。通常，这很棒：jQuery 无需检测当前浏览器关于事件对象的特定实现细节，而是设置包装事件对象本身的 pageX 和 pageY 属性，以便您始终可以自信地访问这些属性。

然而：jQuery，至少在我使用的版本（1.10.2）中，还不知道如何处理MSPointer事件（或pointer事件，用于IE11，就此而言）。因此，虽然我有一个包装事件对象，但没有 pageX 和 pageY 属性。

解决方法是访问event.originalEvent，即浏览器特定的事件。由于该规范看起来只能由 IE 实现，因此假设该对象以 IE 构造它的方式构造并直接访问其上的 pageX 和 pageY 属性应该是相对安全的。