前端移动端开发, 滑动时怎么禁止阴影层下的屏幕滚动.

Question

前端移动端开发, 在页面中打开了一个层,同时打开一个遮罩层, 滚动这个层时 下面的页面也会跟着滚动.怎么禁止下面那个页面的滚动, 只滚动当前的层.

Answer 1

我的做法是阻止touchstart事件的默认行为,不知道有没有更好的方法.
在vue下
@touchstart.prevent
可以这样,
在弹出层和底层元素之间曾加一层遮罩

<div>底层</div><div class="mask">遮罩层</div><div>弹出层</div>

然后

.mask{position:fixed;left:0;top:0;right:0;bottom:0}

然后

$('.mask').on('touchmove',function(e){e.preventDefault()})