用jquery写一个上拉加载

/*可加载页面吗*/
function canLoadMore() {
    return $(‘.loadin‘).length < 1;
}
/*移除正在加载字样*/
function removeMore() {
    $(‘.loadin‘).remove();
}
/*没有更多内容字样*/
function noMore($contentBox) {
    $(‘.loadin‘).html(‘<div style="color: #999;font-size: 36px">没有更多了...</div>‘);
}
/*设置正在加载*/
function setMore($contentBox) {
    $contentBox.append(
        ‘<div class="loadin"><img src="../images/toLoad/toLoad.gif" ></div>‘
    );
}

/**
 * 加载页面
 * @param $contentBox object 容器
 * @param url string 翻页请求的url
 * @param $scrollBox object 容器
 * @param param object 请求参数
 * @param afterMoreMethod function
 */
function pageMore($contentBox,url,$scrollBox=null,param=null,afterMoreMethod=null){
    // alert()
    console.log($contentBox)
    if($contentBox.length < 1)
        return ;

    if($scrollBox == null)
        $scrollBox = $contentBox;

    var nScrollHight = 0; //滚动距离总长(注意不是滚动条的长度)
    var nScrollTop = 0; //滚动到的当前位置
    //滚动时候获取显示区域高度
    var hi = parseInt($scrollBox.get(0).offsetHeight);
    console.log(hi,"offset");
    $scrollBox.scroll(function () {
        hi = hi == 0 ? parseInt($scrollBox.get(0).offsetHeight) : hi;
        nScrollHight = $(this)[0].scrollHeight;
        nScrollTop = $(this)[0].scrollTop;
        var paddingBottom = parseInt($(this).css(‘padding-bottom‘)),
            paddingTop = parseInt($(this).css(‘padding-top‘));

        console.log(nScrollHight, nScrollTop + paddingBottom + paddingTop + hi, hi);
        if (nScrollTop + paddingBottom + paddingTop + hi >= nScrollHight) {
            more();
        }
    });

    $contentBox.data(‘page-num‘,1);

    function more() {
        if(!canLoadMore()) return;
        setMore($contentBox);
        var page_num = $contentBox.data(‘page-num‘);
        page_num = parseInt(page_num) + 1;
        param = param ? param : Object();
        param.page_num = page_num;
        $.get(url,param,function(result){
            if(result.code==1){
                $contentBox.append(result.data.html);
                $contentBox.data(‘page-num‘,page_num);
                removeMore();
                if(afterMoreMethod!==null)
                    afterMoreMethod();
            }else{
                noMore();
            }
        },‘json‘)
    }
}

调用时候直接pageMore（$(‘参数一‘)，null，$（‘参数二‘）），

d

用jquery写一个上拉加载

原文：https://www.cnblogs.com/MrQinjj/p/12027297.html