手机端出现弹框后,禁止页面的滚动。
移动端使用e.preventDefault()禁止滚动及取消,兼容苹果
//实现滚动条无法滚动
var mo=function(e){e.preventDefault();};
/***禁止滑动***/
function stop(){
document.body.style.overflow='hidden';
document.addEventListener("touchmove",mo,false);//禁止页面滑动
}
/***取消滑动限制***/
function move(){
document.body.style.overflow='';//出现滚动条
document.removeEventListener("touchmove",mo,false);
}
改进后:
// 弹框或遮罩层出现后调用,
function addtouchmove () {
document.body.addEventListener('touchmove', function (e) {
e.preventDefault()
}, {passive: false})
}
// 弹框或遮罩层消失后调用,
function cuttouchmove () {
document.body.addEventListener('touchmove', function (e) {
window.event.returnValue = true
})
}
终极版
//给遮罩层加 touchmove事件 阻止默认事件
$('.bg').on('touchmove',function(e){
e.preventDefault();
});
$('.bg').on('touchmove',function(e){
e.stopPropagation()
});