<分区>
在查看 StackOverflow 上有关此主题的许多问题和答案时，所提供的解决方案均不可靠。所有 CSS、JavaScript、jQuery 和混合解决方案都至少有一个缺陷会阻止滚动有效地禁用和/或切换。
我也在网上广泛搜索，但没有找到好的答案。
到目前为止我有这个功能:
function toggleScroll(btn, item) {
$(btn).click(function() {
$(item).toggleClass("noscroll");
});
}
...这将添加一个 overflow: hidden; 到我想要的任何类 onclick，并在第二次点击时将其删除。
问题是，此代码不适用于 iOS 设备。
如何在 iOS 设备上使用它？
理想情况下，我更喜欢纯 CSS 解决方案。但我知道这可能是不可能的，尤其是切换组件。
任何 JavaScript 或 jQuery 解决方案都可以。
提前致谢!
最佳答案
使用 jQuery 在 iOS 设备(iPad、iPhone、Mac)上禁用滚动/滚动
我认为这会让您接近您想要的。唯一的问题可能是切换，它是两个按钮(启用和禁用)。如果您想使切换成为一个按钮，也许您可以发布一个单独的问题，或者其他人可以改进这个答案。 (我主要是一个 HTML/CSS/PHP 的人。我对 JS 有点陌生)。
var disableScroll = false;
var scrollPos = 0;
function stopScroll() {
disableScroll = true;
scrollPos = $(window).scrollTop();
}
function enableScroll() {
disableScroll = false;
}
$(function(){
$(window).bind('scroll', function(){
if(disableScroll) $(window).scrollTop(scrollPos);
});
$(window).bind('touchmove', function(){
$(window).trigger('scroll');
});
});
来源:https://stackoverflow.com/a/17597303/3597276
使用 CSS 在 iOS 设备(iPad、iPhone、Mac)上禁用滚动/滚动
对于在 iOS 设备上禁用滚动的纯 CSS 解决方案，请尝试以下选项:
(当然，这些没有切换。)
html, body {
position: fixed;
}
html, body {
position: relative;
overflow: hidden;
}
body {
position: fixed;
overflow: hidden;
}
body {
position: fixed;
height: 100%;
overflow: hidden;
width: 100%;
}
以下是我阅读的有关此问题的一些帖子和文章。
关于javascript - 如何使用用户控制的切换(启用/禁用)在 iOS 设备(iPad、iPhone、Mac)上禁用滚动/滚动，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31799970/