下拉更新分页

1、 后台返回当前页数、总页数
     <input id="totalPage" name="totalPage" value="${page.totalPage}" type="hidden"/>
     <input id="currentPage" name="currentPage" value="${page.currentPage}" type="hidden"/>
     <input type="hidden" id="change" />

2、JS编写
<script type="text/javascript">
    var pageNumber = 1;
    var change = 0;
    $(function() {
            if($("#totalPage").val()==$("#currentPage").val()){
                    change = 1;
                }
             $(window).scroll(
                function() {
                    if (20 + $(window).scrollTop() >= ($(document).height() - $(window).height())) {
                       if(change==1){
                          return;
                        }
                        pullupRefresh();
                    }
              });    
    })
    
 //上拉加载具体业务实现
   function pullupRefresh() {                   
                    var totalPage=document.getElementById('totalPage').value;
                    var currentPage=document.getElementById('currentPage').value;
                    var url=cxt+ "/wxwebindex/cardPage";
                    
                    if(currentPage*1<totalPage*1){
                            layer.load(2);
                               var data = {
                                comId : comId,
                                currentPage : pageNumber
                            }
                            $.ajax({
                                        type : "POST",//提交表单的方式
                                        url : encodeURI(encodeURI(url)),
                                        data : data,
                                        dataType : "json",//返回的值的类型
                                        contentType : "application/x-www-form-urlencoded; charset=UTF-8",
                                        error : function(XMLHttpRequest,
                                                textStatus, errorThrown) {
                                            layer.alert(textStatus);
                                        },
                                        success : function(rs) {
                                            layer.closeAll("loading");
                                            pageNumber=rs.currentPage;
                                         if (change==0){
                                            $.each(rs.listCard,function(i,val){  
                                            
                                                //拼接li展示页面
                                            
                                            
                                                var imgsrc=rs.listCard[i].CARD_IMAGE;
                                                var img='<img class="sai-img" src="${cxt!}/static/wxweb/images/bhome1.png"/>';
                                                  if(imgsrc!=null && imgsrc!=''){
                                                      img='<img class="sai-img" src="${cxt!}/uploadFiles/uploadImgs/'+imgsrc+'">'; 
                                                   }
                                                var li ='<li style="cursor:pointer;" data-id='+rs.listCard[i].CARD_ID+'>'
                                                       +img
                                                       +'<div class="h_m_r">'
                                                       +'<div class="jiaoyu-tit">'+rs.listCard[i].CARD_TITLE+'</div>'
                                                       +'</div>'
                                                       +'</li>';
                                                       
                                                       
                                                       
                                                    //下拉刷新,新纪录插到最前面;
                                                    $("#mui-card").append(li);
                                             }); 
                                            }
                                            liClick(); //激活li点击事件
                                            if((rs.currentPage==rs.totalPage && change==0)||rs.totalPage==0){
                                                $noinfo=$('<li style="font-size: 14px;text-align: center;">暂无更多信息</li>');
                                                $('#mui-card').append($noinfo);
                                                change=1;
                                            }
                                        },
                                        error: function(){
                                            layer.closeAll("loading");
                                        }
                                    });
                        }
</script>

   } 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值