jQuery實現初始化時滾動條在最底部

此功能應用在移動端的一個h5上。首先爲了禁止在iphone上頁面下拉露出黑底，同時頁面內部可以局部滾動，需要如下操作：

$(function(){
    document.body.ontouchmove = function (e) {
        e.preventDefault();
    };

    var startX = 0, startY = 0;
    //touchstart事件  
    function touchSatrtFunc(evt) {
        try
        {
            //evt.preventDefault(); //阻止觸摸時瀏覽器的縮放、滾動條滾動等  

            var touch = evt.touches[0]; //獲取第一個觸點  
            var x = Number(touch.pageX); //頁面觸點X座標  
            var y = Number(touch.pageY); //頁面觸點Y座標  
            //記錄觸點初始位置  
            startX = x;
            startY = y;

        } catch (e) {
            alert('touchSatrtFunc：' + e.message);
        }
    }
    document.addEventListener('touchstart', touchSatrtFunc, false);

    var _ss = document.getElementById("introPage");//允許滾動的區域

    _ss.ontouchmove = function (ev) {
        var _point = ev.touches[0],
        _top = _ss.scrollTop;
        // 什麼時候到底部
        var _bottomFaVal = _ss.scrollHeight - _ss.offsetHeight;
        // 到達頂端
        if (_top === 0) {
            // 阻止向下滑動
            if (_point.clientY > startY) {
                ev.preventDefault();
            } else {
                // 阻止冒泡
                // 正常執行
                ev.stopPropagation();
            }
        } else if (_top === _bottomFaVal) {
            // 到達底部
            // 阻止向上滑動
            if (_point.clientY < startY) {
                ev.preventDefault();
            } else {
                // 阻止冒泡
                // 正常執行
                ev.stopPropagation();
            }
        } else if (_top > 0 && _top < _bottomFaVal) {
            ev.stopPropagation();
        } else {
            ev.preventDefault();
        }
    };
})  

id爲introPage的div即爲可以滾動的區域。除此之外，在頁面初始化之後，$(“#introPage”)需要滾到至底部，此時需要應用到scrollTop()方法。

方法一：

$('#introPage').scrollTop($('#introPage')[0].scrollHeight);

經測試，除了iPhone6，此方法在其他手機上都能起效，原因不詳~~
因此，爲了兼容iPhone6，使用瞭如下的方法：

方法二：

$('#introPage').animate({scrollTop: $('#introPage')[0].scrollHeight}, 800);

以動畫的方式使該區域滑動到底部。經過測試，此方法可以起效。