在使用jQuery實現遮罩層時,經常需要禁止網頁滾動,以保證用戶無法操作遮罩層下面的內容。下面是使用jQuery實現禁止滾動的方法。
//禁止滾動條
function noscroll() {
//在彈出層出現時,禁止滾動條滾動
$('body').on('touchmove', function (event) {
event.preventDefault();
});
}
//開啟滾動條
function scroll() {
//在彈出層關閉時,允許滾動條滾動
$('body').off('touchmove');
}
以上代碼中,noscroll()方法會在彈出層出現時調用,它會綁定touchmove事件,然后使用preventDefault()方法阻止滾動。而scroll()方法會在彈出層關閉時調用,它會解綁touchmove事件,允許滾動條滾動。
在實際項目中,可以根據需要將noscroll()方法和scroll()方法封裝成統一的方法,方便調用。