ajax 手机端滑动分页

ItShowing 本文由博客端 https://itshowing.com 主动推送
本贴最后更新于 236 天前,其中的信息可能已经事过景迁

js 逻辑代码

$(window).scroll(function(){
	
	//判断是否滑到底部
	if ($(window).scrollTop() + $(window).height() == $(document).height()) {
    	
    	//判断 所有数据是否加载完毕(加载完,代表后台没有数据,划不动了)
    	if(!($("#queryEnd").val() == 'ok')){
	
    		//获取页数
    		var pageNo = $("#pageNo").val();
    		
    		$.ajax({
    			url: "http://itshowing.com",
    			data: "pageNo="+pageNo,
    			type: "POST",
    			dataType:"json",
    			async: false,
    			success:function(result){
    				if(result.status=='1'){
    					if(result.list.length>0){

    						//拼接数据(逻辑代码)
    					
    						//页码 自增1,用于下次查询
    						pageNo = parseInt(pageNo)+1+"";
    						$("#pageNo").val(pageNo);

    					}else{

    						//数据查询完毕 标记
    						$("#queryEnd").val("ok");

    						//底部显示 数量(详情 根据业务需求扩展)
    						
    					}
    					  
    			  	} 			
    			}
    		});
    	}
    }
});

input 标签

<!-- 隐藏域:临时存储页码,用于滚动分页查询 -->
<input type="hidden" id="pageNo" value="2">

<!-- 隐藏域:临时存储标记,是否数据全部加载完成 -->
<input type="hidden" id="queryEnd">
  • AJAX
    22 引用 • 96 回帖

赞助商 我要投放

回帖
请输入回帖内容 ...