我有一个 html 画布，可以在上面绘制鼠标和触摸事件。
我在画布上使用 css touch-action: none 样式来禁止设备在绘图时滚动。
但它只适用于非 IOS 设备。在 IOS 设备上的任何浏览器上，它仍然会执行滚动/滑动操作，并且很难正确绘制。
这似乎是一个 IOS 功能。一个可以轻松适应屏幕的网页仍然可以滚动/滑动。
有什么办法可以解决这个问题？
【问题讨论】：
在自己遇到这个问题一年后，我终于设法解决了。
解决方案：处理画布元素上的 touchstart、touchmove、touchend、touchcancel 事件，并调用 event.preventDefault()。如果它在画布元素之外冒泡，它将滚动。
例子：
var canvas_dom = // make this your canvas DOM element
canvas_dom.addEventListener("touchstart", function(event) {event.preventDefault()})
canvas_dom.addEventListener("touchmove", function(event) {event.preventDefault()})
canvas_dom.addEventListener("touchend", function(event) {event.preventDefault()})
canvas_dom.addEventListener("touchcancel", function(event) {event.preventDefault()})
【讨论】：
您能否验证此页面是否适合您？ http://bencentra.com/code/2014/12/05/html5-canvas-touch-events.html
这在我的 iOS 上运行良好，直到更新 11.3。更新后，拖动时画布始终滚动。在其他操作系统中，解决方案是touch-action:none，或者在 Javascript 世界中：event.preventDefault()。但是，正如您在上面页面后面的代码中看到的那样，Javascript 选项不起作用。
附：我不能强调这曾经在 iOS 11.3 更新之前工作。
【讨论】：