MDN说：
Element接口的setPointerCapture（）方法用于将特定元素指定为未来指针事件的捕获目标。指针的后续事件将针对捕获元素**，直到捕获被释放**。
如果我在pointerDown callback中调用setPointerCapture，它会像预期的那样工作：example-在这里你可以拖动黄色方块，只要你想要的速度，它会跟随光标，直到pointerUp事件发生。
但是如果尝试在pointerMove回调中捕获目标，它不会像我预期的那样工作：example-黄色方块跟随光标，直到光标悬停在方块上。如果你移动你的鼠标太快广场将停止。
如何解释这种行为？我误解了文档吗？
2条答案
按热度按时间xqnpmsa81#
不完全是
规格要求
指针必须处于活动按钮状态，此方法才有效，否则它会默默失败。
处于活动按钮状态意味着：
指针的buttons属性值为非零时的条件。对于鼠标，这是当设备至少有一个按钮被按下时。对于触摸，这是当存在与数字化仪的物理接触时。对于笔，这是当笔与数字化仪物理接触，或者在悬停时至少按下一个按钮时。
因此，如果您的指针设备在您第一次将其移动到元素上时处于此状态，或者从任何其他事件中移动，则它应该工作，直到您释放指针设备。
但是请注意，要使代码在Firefox中工作，您需要
preventDefault()pointerdown 事件。但在Chrome中，使用鼠标设备，您可以通过拖动元素外部开始，然后移动到它上面，捕获将按预期工作。您的代码的问题是它没有检查捕获是否工作，无条件地引发
captured标志。检查element.hasPointerCapture(e.pointerId)而不是此标志。jyztefdp2#
也许你想要的是“指针锁”API --灵活得多。用于游戏和其他鼠标的屏幕位置与其图标无关的情况。
https://developer.mozilla.org/en-US/docs/Web/API/Pointer_Lock_API
从这个页面：
指针锁定与鼠标捕获的不同之处如下：
显然，Capture更适合常规操作：你做了一个滑块，你确保用户的拖动不会被中断，如果鼠标偏离了排水沟线。