国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

上云采購季！| 2核2G4M爆款云服務(wù)器低至59元/年，更有多臺、長期優(yōu)惠，快來選購！

立即前往

分享一個移動端滑到底部翻頁的代碼

kumfo 發(fā)布于2019-08-01 16:09 / 2755人閱讀

摘要：如果有其他需求，比如返回例子中直接返回，可以修改中的代碼，就不贅述了

今天在技術(shù)群看到有朋友有需求，就隨手寫了一個，大家隨便看看~
demo地址：http://www.dtzhuanjia.com/pri...
（備注：這個主要用在移動端，所以用rem隨便寫了寫樣式= =PC看著不舒服用模擬器看吧）

html:




    
    
    下一頁    
    
    
    
    
    


    
    
    
        已經(jīng)加載的1-1
        已經(jīng)加載的1-2
        已經(jīng)加載的1-3
        已經(jīng)加載的1-4
        已經(jīng)加載的1-5

js代碼：

function InitNextPage(obj){
    _this = this;
    _this.bottom = obj.bottom||10;//距離底部像素
    _this.target = obj.target||"body";//插入目標(biāo)源
    _this.url = obj.url||"none";//ajax請求的url
    _this.page = 2;
    //滑到底
    $(window).scroll(function(){
        _this.scrollToBottom();
    });    
}
InitNextPage.prototype = {
    scrollToBottom : function(){
        if($(window).scrollTop()+$(window).height()>$(document).height()-_this.bottom){
            if(_this.url=="none"){
                alert("ajax url不能為空");
                return;
            }
            $.ajax({
                url : _this.url,
                async: false,
                data : {
                    page : _this.page,
                },
                success : function(data){
                    _this.page++;
                    $(_this.target).append(data);
                }
            });
        }
    }
}

備注：

var initNextPage = new InitNextPage({
    bottom : 20,//距離底部像素
    target : ".main",//插入目標(biāo)源
    url : "http://www.dtzhuanjia.com/private/plugin/nextpage/nextPage.php"http://ajax請求的url
})

上面代碼中：
bottom是距離底部多少像素時執(zhí)行ajax，默認10
target是執(zhí)行成功后，像哪個dom插入返回的數(shù)據(jù)，默認為body
url是ajax url地址，必填。

如果有其他需求，比如返回json（例子中直接返回Html），可以修改success中的代碼，就不贅述了~