我正在制作一个在 HTML5 内绘制的应用程序canvas，但我无法通过手机或平板电脑进行绘制。
下推时无法避免浏览器的原生滚动或 chrome 刷新
我在jsfiddle中创建了一个示例，因此您可以看到它。
问问题
1695 次
2 回答
4
这看起来像一个真正的 Chrome 错误，我将使用您的示例代码报告它。如果您想在 JavaScript 中动态决定是否使用您自己的代码处理 pointerMove 还是允许本机浏览器处理，则在 CSS 中设置触摸动作不是解决方案。
如果您设置 touch-action: "none"，则本机浏览器处理将永远不会运行。相反，正如您所报告的那样，没有触摸动作设置（相当于默认的“auto”）将不起作用，因为 Chrome 会忽略对 pointerMove 的 preventDefault() 调用并仍然调用 pointerCancel - 一个错误。
请注意，如果您改为为 touchMove 添加一个侦听器，使用被动：false 标志，则 preventDefault() 将按预期工作，避免 touchCancel。但是，您必须使用单独的鼠标事件和触摸事件侦听器，这是您试图通过使用指针事件来避免的。
于 2017-12-28T07:02:24.540 回答
3
要禁止默认 UA 行为，您需要将 CSS 属性添加touch-action: none到 canvas 元素。
touch-action指定 HTML 元素是否以及如何响应手势。touch-action: none不触发 UA 行为（例如拖动或缩放）。默认属性是touch-action: auto，它允许触发所有 UA 行为。
于 2017-01-04T17:51:26.970 回答