我有一个页面，其中有一个部分可以绘制草图。但是，在移动浏览器上使用touchmove事件（至少是垂直事件）时，也会滚动页面（这会降低绘制体验）。有没有一种方法可以a）禁用并重新启用页面滚动（因此我可以在每行开始时将其关闭，但在完成每一行后将其重新打开），或b）禁用默认处理画草图的画布上的touchmove事件（大概是滚动）（我不能完全禁用它们，因为草图使用它们）？
我已经使用了jquery-mobile vmouse处理程序作为草图，如果有区别的话。
更新：在iPhone上，如果我选择要在其上绘制草图的画布，或者在绘图之前只是握住手指一点，该页面就不会滚动，这也不是因为我在页面中进行了编码。
Answers:
touchstart事件，因此如果您想识别触摸事件但不允许滚动，则无用。
touchstart可以正常触发。
注意：正如@nevf的评论所指出的，由于性能变化，该解决方案可能不再起作用（至少在Chrome中）。建议使用
touch-action@JohnWeisz的答案也建议使用。
类似于@Llepwryd给出了答案，我用的组合ontouchstart，并ontouchmove防止滚动时，它是有一定的元素。
摘自我的一个项目：
window.blockMenuHeaderScroll = false;
$(window).on('touchstart', function(e)
{
if ($(e.target).closest('#mobileMenuHeader').length == 1)
{
blockMenuHeaderScroll = true;
}
});
$(window).on('touchend', function()
{
blockMenuHeaderScroll = false;
});
$(window).on('touchmove', function(e)
{
if (blockMenuHeaderScroll)
{
e.preventDefault();
}
});
本质上，我正在做的事情是监听触摸开始，以查看它是否开始于使用jQuery的另一个元素的子元素，.closest并允许在滚动时打开/关闭触摸运动。该e.target指触摸开始始于元素。
您想防止触摸移动事件的默认设置，但是您还需要在触摸事件结束时为此清除标志，否则任何触摸滚动事件都不会起作用。
这可以在没有jQuery的情况下完成，但就我的用法而言，我已经有了jQuery，不需要编写任何代码来查找元素是否具有特定的父级。
截至2013-06-18，已在Android和iPod Touch上的Chrome中进行了测试
$(".carousel").on('touchstart', function (e) { e.preventDefault(); });，可防止在旋转木马上上下滚动：)
CSS上有一些“ hack”，它还允许您禁用滚动：
.lock-screen {
height: 100%;
overflow: hidden;
width: 100%;
position: fixed;
}
在主体上添加该类将防止滚动。
document.addEventListener('touchstart', function(e) {e.preventDefault()}, false);
document.addEventListener('touchmove', function(e) {e.preventDefault()}, false);
这应该可以防止滚动，但也将破坏其他触摸事件，除非您定义自定义的方式来处理它们。
{passive: false} document.addEventListener('touchstart', handleEndEventFn, { passive: false });
touchmove而不是将事件侦听器绑定到文档，而是将事件侦听器直接绑定到canvas元素，这有助于防止在使用画布时滚动，但是touchstart由于我没有阻止它而可以工作。
document.removeEventListener('touchmove', handleFn)，但是没有用。
最终的解决方案将被设置overflow: hidden;在document.documentElement像这样：
/* element is an HTML element You want catch the touch */
element.addEventListener('touchstart', function(e) {
document.documentElement.style.overflow = 'hidden';
});
document.addEventListener('touchend', function(e) {
document.documentElement.style.overflow = 'auto';
});
通过设置 overflow: hidden触摸开始，它使超出窗口的所有内容都隐藏起来，从而消除了滚动任何内容的可用性（没有内容可滚动）。
touchend通过设置overflow为可以释放锁定后auto（默认值）。
这是更好地把这段<html>，因为<body>可能用于做一些样式设计，而且它会使孩子表现出意外的行为。
编辑：关于-Safari根据MDNtouch-action: none;不支持它。
尝试在发生触摸事件时不想滚动的东西上隐藏溢出。例如，在开始时将溢出设置为隐藏，然后在结束时将其设置回自动。
你试过了吗？我想知道这是否行得通。
document.addEventListener('ontouchstart', function(e) {
document.body.style.overflow = "hidden";
}, false);
document.addEventListener('ontouchmove', function(e) {
document.body.style.overflow = "auto";
}, false);
令我惊讶的是，“ preventDefault（）”方法在iOS 13.7的最新Google Chrome（版本85）上对我有效。它也可以在同一设备上的Safari上运行，也可以在我的Android 8.0平板电脑上运行。我目前在我的网站上将其实现为2D视图：https： //papercraft-maker.com