基于LayerPage的异步分页-CSDN博客

LayerPage的分页是基于一个完整的数据集，实际开发中不可能把所有的数据从数据库中取出，因此需要异步分页

LayerPage的组件引入：

<script type="text/javascript" src="${pageContext.request.contextPath}/layer/laypage/laypage.js"></script>

网页代码‘：

function paperPage(){
	var nums = 4; //每页出现的数量
	var totalRecord = 0;//总记录数，由ajax返回
	var pages = 0;//总页数，获得总记录数后算得；
	//生成分页html代码的方法
	var thisDate = function(curr){
		var str = '';
		$.ajax({
			type:'get',
			url: localhost + "/paper/getPaperPageData.action",
			dataType:"json",
			data:"pageNum="+curr + "&pageSize="+nums,
			contentType:"application/json",
			success:function(data){
				
			    for(var i = 0; i < data.length; i++){
			        str += '<tr class="a'+(i%2)+'">'
					+'<td width="400px">'+data[i].paperId+'</td>'
					+'<td width="400px">'
					+'<div class="paper-id-btn" createId="'+data[i].paperId+'">查看</div>';
			        +'</td></tr>';
			        document.getElementById('paperTable').innerHTML = str;
			    }
			}
		});
	}
	//页面加载，获取总试卷条数
	$.ajax({
		type:'post',
		url: localhost + "/paper/getPaperTotalRecord.action",
		dataType:"json",
		contentType:"application/json",
		success:function(data){
			totalRecord = data;
			pages = Math.ceil(totalRecord/nums); //得到总页数
			
			//调用分页
			laypage({
			    cont: 'paperButtom',
			    pages: pages,
			    jump: function(obj){
			    	thisDate(obj.curr);
			    }
			})
		}
	});
}

转载于:https://my.oschina.net/cnzxzc/blog/684145