javascript - setPointerCapture 是否仅适用于 pointerDown 事件？

Question

MDN说：

Element 接口的 setPointerCapture() 方法用于指定特定元素作为未来指针事件的捕获目标。指针的后续事件将针对捕获元素，直到捕获被释放。

如果我setPointerCapture在pointerDown回调中调用它，它会按预期工作：示例- 在这里你可以随心所欲地拖动黄色方块，它会跟随光标直到pointerUp事件发生。

但是，如果尝试在pointerMove回调中捕获目标，它将无法按我的预期工作：示例- 黄色方块跟随光标，直到光标悬停在方块上。如果您将鼠标移动得太快，方块将停止。

如何解释这种行为？我误解了文档吗？

标签： javascripteventspointer-events

Answer 1

不完全是。

规格要求

指针必须处于其活动按钮状态才能使此方法有效，否则它会静默失败。

处于活动按钮状态意味着：

当指针的按钮属性具有非零值时的条件。对于鼠标，这是指设备至少按下了一个按钮。对于触摸，这是与数字化仪进行物理接触的时候。对于笔，这是指笔与数字化仪有物理接触，或者在悬停时至少按下一个按钮。

因此，如果您的指针设备在您第一次将其移到您的元素上时处于此状态，或者从任何其他事件中移动，它应该可以工作，直到您释放指针设备。
但是请注意，要让您的代码在 Firefox 中运行，您需要 preventDefault()使用pointerdown事件。但是在 Chrome 中，使用鼠标设备，您可以先拖动元素外部，然后在其上移动，然后捕获将按预期工作。

您的代码的问题是它不检查捕获是否有效，captured无条件地提高标志。而不是这个标志，检查element.hasPointerCapture(e.pointerId).