如何在手机上实现弹出框弹出时，弹出框内可以上下滚动，背后的页面锁定不能滚动？

Question

想要在手机的页面上弹出框弹出来的时候，背后的页面内容锁定不能上下滚动，只有弹出框内的内容可以滚动。关闭弹出框的时候让页面再恢复可上下滚动状态。弹出框是自己编写的一个div。onmousewheel="return false;"只有在PC上才好使，在手机上不适用。
然后找到了这个

document.addEventListener('touchmove', function (event) { event.preventDefault();}, false);

但又会无差别的把整个boby的内容都禁止滚动，实现不了需求。
请问有没有大神有其他的解决方法？

Answer 1

弹窗的时候body 加 overflow: hidden; 关闭的时候就去掉，就可以

Answer 2

弹出拟态窗口的时候给body设置：

html,
body {
    height: 100%;
    overflow: hidden;
}

关闭拟态窗口就：

html,
body {
    overflow: visible
}

Answer 3

手机上都没有onmousewheel属性

Answer 4

敢问最后用什么方法解决呢？