[JavaScript知识库]使用layui的laypage完成分页

使用layui分页

<link rel="stylesheet" href="css/layui.css">//样式直接放header里
<div id="test1"></div>
<script src="js/layui.js"></script>
//根据total（数据总量）初始化分页组件
var js_total=0;
function aaa(total){
			layui.use(['laypage'], function() {
      		var laypage = layui.laypage; //分页
		      /*layer弹出一个示例
		      layer.msg('Hello World');*/
		    laypage.render({
			elem: 'test1'
			,count: total //数据总数，从服务端得到
			,limit: 20
			,limits: [20, 30, 50]
		    ,layout: ['count', 'prev', 'page', 'next', 'limit']
			,jump: function(obj, first){
				//obj包含了当前分页的所有参数，比如：
				console.log(obj.curr); //得到当前页，以便向服务端请求对应页的数据。
				console.log(obj.limit); //得到每页显示的条数
	    		
				//首次不执行
				if(!first){
				//do something
				serch(obj.curr,obj.limit);
				}
			}
		});
    });
		}

//获取总量后调用分页组件
function getTotal(){
	$("#tbodyRwfp").html("");
	var queryksnd =  $("#queryksnd").val();
	var querykc = $("#querykc").val();
	$.ajax({
   type: "POST",
   url: "dataTj.do?method=getStbTotal&queryksnd="+queryksnd+"&querykc="+querykc,
   dataType:'json',   //接受数据格式
   async: 'false',
   error:function(XMLHttpRequest){
   	alert(XMLHttpRequest.responseText);
   },
   success: function(data){
	   if(data.isTrue){
	   		js_total=data.total;
	   		console.log(js_total);
	   		aaa(js_total);
	   		if(js_total>0){
	   			serch(1,20);
	   		}
	   }else{
	    	alert(data.errMsg);
	    	return;
	   }
   }
});
}

//每次点击页码所调用的函数
function serch(page,limit){
	var queryksnd =  $("#queryksnd").val();
	var querykc = $("#querykc").val();
	//alert(queryksnd+querykc);
	$.ajax({
   type: "POST",
   url: "dataTj.do?method=getStbDownladTj&queryksnd="+queryksnd+"&querykc="+querykc+"&page="+page+"&limit="+limit,
   dataType:'json',   //接受数据格式
   async: 'false',
   error:function(XMLHttpRequest){
   	alert(XMLHttpRequest.responseText);
   },
   success: function(data){
	   if(data.isTrue){
	   		var list  = data.list;
	   		console.log(list)
	   		//js_total=data.total;
	   		var pyrwList = data.list;
			$("#tbodyRwfp").html("");
			for(var i=0;i<pyrwList.length;i++){
				var pyrwMap = pyrwList[i];
				var ssmc = pyrwMap["SSMC"];
				var kc = pyrwMap["KC"];
				var f = (pyrwMap["F"]=="0"?"否":"是");
				var s = (pyrwMap["S"]=="0"?"否":"是");
				
				var pyrwStr = "<tr align='center'><td>"+ssmc+"</td>";
				pyrwStr += "<td>"+kc+"</td>";
				pyrwStr += "<td>"+f+"</td>";
				pyrwStr += "<td>"+s+"</td>";
				pyrwStr += "</tr>";
				$("#tbodyRwfp").append(pyrwStr);
				}
	   }else{
	    	alert(data.errMsg);
	    	return;
	   }
   }
});
}

创作打卡挑战赛

赢取流量/现金/CSDN周边激励大奖