屏蔽微信下拉出现黑底现象

最近做的项目遇到了一个需求，在ios上微信网页下拉的时候不能出现黑底。如果要做的网页本来就设计成不能滚动的效果的话，普遍流传的方法是屏蔽掉 body 的 touchstart 或 touchmove 事件，但也会让所有滚动不可用，只适用部分页面。解决的方法很简单：

document.addEventListener('touchmove', function(e) {
    e.preventDefault();
});

这样就可以禁止网页的滚动。但是当遇到网页内容超过窗口的100%的时候，禁止滚动就会导致用户没法滚动屏幕看到窗口以外的内容。因此这个办法不可行啦！

如果遇到了需要部分滚动的页面，在网上找到了以下办法：

$(function(){
    if (!HTMLElement.currentStyle) {
        function _getStyle(prop) {
            var _s = window.getComputedStyle(this, null)
            return prop ? _s[prop] : _s;
        }
        HTMLElement.prototype.currentStyle = _getStyle;
        HTMLElement.prototype.getStyle = _getStyle;
    }
// 阻止微信下拉出黑底插件
    function PreventScroll() {
        // // 非微信浏览器直接跳出 -- 后来发现好些浏览器都有这个坑，所以去掉
        // var ua = navigator.userAgent.toLowerCase();
        // if (!ua.match(/MicroMessenger/i)) return;

        var elem = arguments || []; // 传入绑定的元素
        var $elem = [];     // 存储所有需要监听的元素

        // 获取需要监听的元素
        for (var i=0,len=elem.length; i<len; i++) {
            var $e = document.querySelectorAll(elem[i]);
            if (!$e) {console.error('您输入的元素不对，请检查'); return;}
            for(var j=0; j<$e.length; j++) {
                if ($e[j].currentStyle('overflow').match(/auto|scroll/i)) {
                    $elem.push($e[j]);
                }
            }
        }

        window.addEventListener('touchstart', function(e){
            window.scroll_start = e.touches[0].clientY;
        });
        window.addEventListener('touchmove', prevent);

        function prevent(e) {
            var status = '11'; // 1容许 0禁止，十位表示向上滑动，个位表示向下滑动
            var startY = window.scroll_start;
            var currentY = e.touches[0].clientY;
            var direction = currentY - startY > 0 ? '10' : '01';  // 当前的滚动方向，10 表示向上滑动

            $elem.forEach(function(ele){
                var scrollTop = ele.scrollTop,
                    offsetHeight = ele.offsetHeight,
                    scrollHeight = ele.scrollHeight;

                if (scrollTop === 0) {
                    // 到顶，禁止向下滑动，或高度不够，禁止滑动
                    status = offsetHeight >= scrollHeight ? '00' : '01';
                } else if (scrollTop + offsetHeight >= scrollHeight) {
                    // 到底，则禁止向上滑动
                    status = '10';
                }
            });

            // output.innerHTML = status + ' ' + ++count;
            // 如果有滑动障碍，如到顶到底等
            if (status != '11') {
                if (!(parseInt(status, 2) & parseInt(direction, 2))) {
                    e.preventDefault();
                    return;
                }
            }
        }
    }

    PreventScroll('body');
});

调用PreventScroll();函数即可。但是此方法在安卓上可行，在ios上如果手一直拖动网页不放开，滚动条不消失的话，黑底还是会出现。。不知道大家有什么更完善的方法呢？