javascript - 移动端弹层滑动问题

Question

模拟一个弹层带滚动，有一个问题，弹层列表滑动到底部的时候，再次滑动的时候页面也会跟着滑动；如果判断滚动滑动底部然后禁止页面滑动event.preventDefault()，这样页面不会滑动，但是弹层也不能滑动了；有什么方法解决，弹层列表能滑动，页面不滑动；

demo地址

https://liangweibiao.github.i...

Answer 1

把body的touch都写了event.preventDefault() 试试

Answer 2

event.stopPropagation 能够解决你的问题

Answer 3

window.ontouchstart = function(){
    document.body.style.overflow= "hidden";
}

window.ontouchend = function(){
    document.body.style.overflow= "visible";
}

Answer 4

一种比较友好的方案是禁用掉原生的scroll，并且监听scroll事件，通过然后scrollTop+deltaY来模拟滚动，github上有一种实现方案可以参考一下https://github.com/MohammadYounes/jquery-scrollLock