js 滚动加载

$(function(){
    var page=2,
    canPullUP=true, //控制是否可以继续滑动加载
    stopScroll=true,
    pullUpOffset=450;
function getData(id,pageSize){
    $('#pullUp').show();
    $.ajax({
        url:"http://www.86sb.com/adv/sbadvad",
        type : 'GET',
        dataType: 'jsonp',
        jsonp: 'callback',
        data: {
            id:id,
            page: page,
            page_size: pageSize,
            noflag:1
        },
        success: function(data) {
            var res=data.result.data;
            if(data.status!=0){
                canPullUP=false;
                stopScroll=false;
                return
            }
            canPullUP=true;
            stopScroll=true;
            $('#pullUp').hide();
            if(res.length==0){
                canPullUP=false;
                stopScroll=false;
                $('.last').show()
                return
            }
            for(var i=0;i<res.length;i++){
                var orderType;
                if(res[i].sbflag=='paid'){
                     orderType="paid"
                }else if(res[i].sbflag=='refund'){
                     orderType="refund"
                }else{
                orderType="non-payment"
               }
                var _html1='<div class="content">'+
                                '<a href="">'+
                                    '<div class="right">'+
                                        '<div class="top">'+
                                            '<span class="name">李大黄鸭</span>'+
                                            '<span class="time-fc fr">2018.08.16 10:49</span>'+
                                            '<span class="fr time-fc">订单日期:</span>'+
                                        '</div>'+
                                        '<div class="middle">'+
                                            '<span >商标注册号:</span>'+
                                            '<span class="fc">18493534</span>'+
                                            '<span class="fr fc">25类服装鞋帽'+'</span>'+
                                            '<span class="fr">商标类别:</span>'+
                                        '</div>'+
                                        // 二期新增html
                                        '<div class="middle">'+
                                            '<span >商标持有人:</span>'+
                                            '<span class="fc">上海彪马服饰有限公司 </span>'+
                                        '</div>'+
                                    '</div>'+
                                    '<div class="bottom">'+
                                            '<span class="bottom-fc">订单号:</span>'+
                                            '<span class="bottom-fc fc">18493534</span>'+
                                            '<span class="order-type order-type_'+orderType+'">'+'未付款</span>'+
                                    '</div>'+
                                '</a>'+
                            '</div>'
                   
                 $('.section .content').last().after(_html1)
            }
            page++;
        },
        error:function(){
            alert('失败');
            $('#pullUp').hide();
        }
    })
}
getData('141',10);
function loadmore(obj){
        if(canPullUP){
            /**
 $(window).scrollTop()和$(document).scrollTop()具有相同的效果,都为返回滚动条的垂直位置,
    但是$(window).scrollTop()被所有浏览器支持。
    单独来说: 
    $(document)是获取文档对象 
    $(window)是获取窗口对象


    $(document).height()  //是获取整个页面的高度
    $(window).height()  //是获取当前 也就是你浏览器所能看到的页面的那部分的高度
    这个大小在你缩放浏览器窗口大小时 会改变 与document是不一样的  根据英文应该也能理解吧
    $(window).scrollTop() + $(window).height() = $(document).height()
    要获取顶端 只需要获取到scrollTop()==0的时候 就是顶端了

        要获取底端 只要获取scrollTop()>=$(document).height()-$(window).height() 
        就可以知道已经滚动到底端了
 */
                var scrollTop = $(obj).scrollTop(),
                scrollHeight = $(document).height(),
                windowHeight = $(obj).height();
            if(scrollTop + windowHeight >= scrollHeight-pullUpOffset){
                if(!stopScroll){
                    return
                }
                canPullUP=false;
                getData('141',10);
            }
        }
    }
    $(window).scroll(function (){
        if(!canPullUP){
            return
        }
        loadmore($(this));
    });


// 二期新增js 
    // 日历初始化
    function rangeBasicInit() {
        var instance = mobiscroll.range('#rangeBasic-demo', {
            theme: 'default',                                    
                lang: 'zh',                               
                display:'bottom',                         
            defaultValue: [new Date(), new Date()],
            onSet:function(event,inst){
                console.log(typeof event.valueText)
                var setTime=event.valueText.split("-");
                $('.begin-time').val(setTime[0]);
                $('.end-time').val(setTime[1]);
                console.log(setTime);
                // $('#calender').val(event.valueText);
                // var form = document.getElementById('date-form');
                // // 提交form:
                // console.log(inst)
                // setTimeout(() => {
                //     form.submit();

                // }, 5000);
            } 
        });    
    }
    rangeBasicInit()
})

猜你喜欢

转载自www.cnblogs.com/MR-cui/p/10411913.html
今日推荐