我知道这是一个老问题，但我不得不做一些非常相似的事情，在花了一段时间寻找答案并尝试了不同的方法后，我最终使用了一个非常简单的解决方案。

我的问题非常相似，几乎相同，唯一的区别是我不需要实际显示滚动条-我只需要确保它的宽度仍然被使用，所以当我的覆盖显示时，页面的宽度不会改变。

当我开始滑动覆盖到屏幕，我做:

$('body').addClass('stop-scrolling').css('margin-right', 8);

在我将覆盖层从屏幕上滑动后，我这样做:

$('body').removeClass('stop-scrolling').css('margin-right', 0);

重要:这是完美的工作，因为我的叠加是绝对定位，对:0px时可见。

我对这个问题的看法还包括对主体宽度的关注，因为当我们用overflow = "hidden"隐藏滚动条时，页面似乎会跳舞。 下面的代码非常适合我，并且是基于Angular的方法。

element.bind('mouseenter', function() {
    var w = document.body.offsetWidth;
    document.body.style.overflow = 'hidden';
    document.body.style.width = w + 'px';
});

element.bind('mouseleave', function() {
    document.body.style.overflow = 'initial';
    document.body.style.width = 'auto';
});

对我来说，这并没有带来任何内容跳跃。

禁用滚动:

this.htmlBody = $('body')
this.scrollPos = document.documentElement.scrollTop
this.htmlBody.css('top', -this.scrollPos + 'px').addClass('disable-scroll')

重新启用滚动:

this.htmlBody.removeClass('disable-scroll')
$(window).scrollTop(this.scrollPos)

而CSS:

body.disable-scroll {
  position: fixed;
  width: 100%;
}

还有另一个解决方案!

而不是使用多个事件监听器和添加，停止和关闭它们，你可以只添加一次回调监听器，其中你可以在你的函数中共享事件，只在需要的时候调用preventDefault等等，甚至实现自己的事件优先级系统。

我在另一个网站上找到了答案:

禁用滚动:

$( ".popup").live({
    popupbeforeposition: function(event, ui) {
    $("body").on("touchmove", false);
}
});

关闭后弹出窗口释放滚动:

$( ".popup" ).live({
    popupafterclose: function(event, ui) {
    $("body").unbind("touchmove");
}
});

网站我继承了，有一个滚动的链接。为了暂时禁用滚动单击特定按钮，这对我来说是有效的:

$(document).ready(function() {      
    $('button.class-name').click(function(event) {
        disableScroll();
        setTimeout(enableScroll, 500);  
    });
});


function disableScroll() {
    scrollTop =  window.pageYOffset || document.documentElement.scrollTop; 
    scrollLeft =  window.pageXOffset || document.documentElement.scrollLeft, 

    window.onscroll = function() { 
            window.scrollTo(scrollLeft, scrollTop); 
    };
}

function enableScroll() { 
    window.onscroll = function() {}; 
}