javascript - 触摸移动某个元素时禁用滚动

Question

我有一个页面，其中包含一个用于绘制绘图的部分。但在移动浏览器上使用时，touchmove 事件(至少是垂直事件)也会滚动页面(这会降低绘图体验)。有没有办法 a) 禁用并重新启用页面的滚动(这样我可以在每行开始时将其关闭，但在每行完成后将其重新打开)，或 b) 禁用默认处理转到绘制草图的 Canvas 的 touchmove 事件(可能还有滚动)(我不能完全禁用它们，因为草图使用它们)？

我已经为草图使用了 jquery-mobile vmouse 处理程序，如果这有所不同的话。

更新:在 iPhone 上，如果我选择要在其中绘制草图的 Canvas ，或者只是在绘制之前按住我的手指一点，页面不会滚动，而不是因为我的任何原因在页面中编码。

Answer 1

设置touch-action CSS 属性为 none，即使与 passive event listeners 一起工作:

touch-action: none;

当事件源自那个元素时，将此属性应用于元素不会触发默认(滚动)行为。