一般禁止body滾動(dòng)的做法就是設(shè)置overflow:hidden。

但是很奇怪的發(fā)現(xiàn)在移動(dòng)端瀏覽器和微信瀏覽器上這個(gè)不起作用，然后我分析了我的寫(xiě)法，就是在body上加了一個(gè)class去定義屬性，然后改成標(biāo)簽的定位，如body{overflow:hidden;}，這個(gè)實(shí)現(xiàn)是可以的，沒(méi)有滾動(dòng)條。

再進(jìn)一步分析，如果要用class去實(shí)現(xiàn)沒(méi)有滾動(dòng)條，如下代碼設(shè)置：

.index_body {
    position: fixed;
    height: 100%;
    overflow-y: hidden;  /*為了兼容普通PC的瀏覽器*/
}

這個(gè)就是完全的禁止上下滑動(dòng)，沒(méi)有滾動(dòng)條，且在iOS的safari瀏覽器上完全不能上下滾，但是卻發(fā)現(xiàn)微信瀏覽器上可以上下縮動(dòng)（下面再解決）。

我最后發(fā)現(xiàn)，上面這種解決是普遍的瀏覽器做法，如果要更徹底一點(diǎn)，就直接使用js代碼去控制touchmove的事件，直接精致，這個(gè)在微信和手機(jī)瀏覽器上完成可行。

代碼如下：

/*去掉手機(jī)滑動(dòng)默認(rèn)行為*/
$('body').on('touchmove', function (event) {
    event.preventDefault();
});

我還收集了一些設(shè)置隱藏滾動(dòng)條的方法：

1、body加position:fixed;width:100%;height:100%

2、給要滾動(dòng)的元素添加一個(gè)父級(jí)，設(shè)定高度，overflow：auto

3、html,body{height:100%;overflow:hidden}

參考：http://www.cnblogs.com/lbcheng/p/6044303.html

經(jīng)過(guò)上面的設(shè)置，如果用戶在微信瀏覽器上不能滾動(dòng)，但是跳出到了iOS的safari瀏覽器之后，會(huì)有很多變數(shù)，比如高度不夠，這時(shí)滾動(dòng)也會(huì)好一些，那么我這樣設(shè)置：

• 1、如果在微信上，默認(rèn)禁止?jié)L動(dòng)，并且連默認(rèn)的上下縮滑都不能。
• 2、當(dāng)跳出到手機(jī)瀏覽器上完全可以滑動(dòng)。

上面的思路實(shí)現(xiàn)：

1、通過(guò)微信useragent來(lái)判斷，如果是微信瀏覽器自動(dòng)加入class去設(shè)置。
2、非微信useragent就默認(rèn)不加class。

具體實(shí)現(xiàn)：

微信上，禁止上下縮滑：

/*去掉手機(jī)滑動(dòng)默認(rèn)行為*/
$('body').on('touchmove', function (event) {
   event.preventDefault();
});

判斷微信瀏覽器：

/*微信瀏覽器特殊處理*/
if (window.navigator.userAgent.toLowerCase().match(/MicroMessenger/i) == 'micromessenger') {
    $('body').addClass('index_body'); //添加禁止?jié)L動(dòng)的樣式
}else{
    $('body').removeClass('index_body'); //去除禁止?jié)L動(dòng)的樣式}
},