我使用showModalDialog，显示二级页面为模态对话框。

隐藏主窗口滚动条:

document.body.style.overflow = "hidden";

关闭模态对话框时，显示主窗口滚动条:

document.body.style.overflow = "scroll";

从对话框中访问主窗口中的元素:

parent.document.getElementById('dialog-close').click();

仅供任何搜索showModalDialog的人使用:(在原始代码第29行之后)

document.getElementById('dialog-body').contentWindow.dialogArguments = arg;
document.body.style.overflow = "hidden";//****
document.getElementById('dialog-close').addEventListener('click', function(e) {
    e.preventDefault();
    document.body.style.overflow = "scroll";//****
    dialog.close();
});

在Chrome 56和其他现代浏览器中，你必须在addEventListener调用中添加passive:false来使preventDefault生效。所以我用这个来停止手机上的滚动:

function preventDefault(e){
    e.preventDefault();
}

function disableScroll(){
    document.body.addEventListener('touchmove', preventDefault, { passive: false });
}
function enableScroll(){
    document.body.removeEventListener('touchmove', preventDefault, { passive: false });
}

我也有同样的问题，下面是我处理它的方法。

/* file.js */
var body = document.getElementsByTagName('body')[0];
//if window dont scroll
body.classList.add("no-scroll");
//if window scroll
body.classList.remove("no-scroll");

/* file.css */
.no-scroll{
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

希望这对你有所帮助。

只需在body中添加一个类即可:

.stop-scrolling {
  height: 100%;
  overflow: hidden;
}

添加类，然后删除当你想重新启用滚动，测试在IE, FF, Safari和Chrome。

$('body').addClass('stop-scrolling')

对于移动设备，你需要处理touchmove事件:

$('body').bind('touchmove', function(e){e.preventDefault()})

并取消绑定以重新启用滚动。在iOS6和Android 2.3.3测试

$('body').unbind('touchmove')

我找到了一个更好，但有问题的方法，结合了sdleihssirhc的想法:

window.onscroll = function() {
    window.scrollTo(window.scrollX, window.scrollY);
    //Or
    //window.scroll(window.scrollX, window.scrollY);
    //Or Fallback
    //window.scrollX=window.scrollX;
    //window.scrollY=window.scrollY;
};

我没有测试它，但我稍后会编辑，让你们都知道。我有85%的把握它能在主流浏览器上运行。

我在这里用了一个简单的技巧:

.no-scroll{
  overflow: hidden;
}

let toggle_scrolling_state = () => {
   element.classList.toggle("no-scroll");
}

然后当你想要停止滚动事件或…