js禁止滚动条滚动

方法一：将body设置为fixed（滚动条会消失，页面会抖动，比较麻烦）

//弹层背景滑动问题
        var top1 = 0;
        function stopBodyScroll(isFixed) {
            var bodyEl = document.body
            if (isFixed) {
                top1 = window.scrollY
                bodyEl.style.position = 'fixed'
                bodyEl.style.top = -top1 + 'px'
            }else{
                bodyEl.style.position = ''
                bodyEl.style.top = ''
                window.scrollTo(0, top1) // 回到原先的top
            }
        }

// 关闭滑动
stopBodyScroll(true);
$('body').css({'position':'fixed',"width":"100%"});

// 开启滑动
stopBodyScroll(false);
$("body").css({"position":"initial"});

方法二：在body上添加overflow:hidden（滚动条会消失，页面会抖动，简单粗暴）

//禁用滚动条
function unScroll(){
	$('body').css("overflow-Y","hidden");
}

//停止禁用滚动条
function removeUnScroll() {
	$('body').css("overflow-Y","hidden");
}

方法三：禁用滚动条（滚动条不会消失，页面不会抖动,jquery提供的，但是有时候不生效）

//禁用滚动条
function unScroll() {
    var top = $(document).scrollTop();
    $(document).on('scroll.unable',function (e) {
        $(document).scrollTop(top);
    })
}
//停止禁用滚动条
function removeUnScroll() {
    $(document).unbind("scroll.unable");
}

方法四：结合方法二添加padding-right(滚动条的宽度，使页面不抖动)

function unScroll(){
	$('body').css("overflow-Y","hidden");
	
	//计算滚动条宽度 (滚动条的宽度不是都为17px的，算一下当前的比较精确)
	const outer = document.createElement('div');
	const inner = document.createElement('div');
	outer.style.overflow = 'scroll';
	document.body.appendChild(outer);
	outer.appendChild(inner);
	const scrollbarWidth = outer.offsetWidth - inner.offsetWidth;
	document.body.removeChild(outer);
	
	$(document.body).css( "padding-right",scrollbarWidth);
}

//停止禁用滚动条
function removeUnScroll() {
    $(document.body).css( "overflow-Y","auto");
    $(document.body).css( "padding-right","0px");
}