layui表格分页--laypage

后台返回所有数据，由前端分页

1.先引入layui.css、layui.js，因此时需要用到ajax，所以也引入jQuery

2.html如下：

    

	

	   
编号
	   
code
	   
有/无(算力)
	   
数据库录入MAC地址
	   
最后一次提交算力时间
        
    
    
			
				
	

3.采用ajax发送请求，获取全部数据之后，引入laypage进行分页

!function (){			
    $.ajax({
	url:'http://47.106.120.69:8009/cgi-bin/getinfo.cgi?version=1.1&cl=app&page=1',				
	method:'get',
	cache: false,
	dataType: 'json',
	success: function(data){					
	   if(data.errno == 0){						
	         var html = '',tableArr = data.data;	
		 if(tableArr.length > 0){							
		    initTable(tableArr)														
		 }else{
		    html += '暂无相关数据'								
		 }
		 $("#table tbody").html(html)	
	    }					
	},error: function(){
		layer.alert("网络连接有误，请稍后！")					
	}
	})						
}()		
function initTable(data){
	layui.use(['laypage'], function(){
		var laypage = layui.laypage;
		laypage.render({
		  elem: 'pagination',
		  count: data.length,
		  limit: 16,
		  jump: function(obj){
		        document.getElementById('tbody').innerHTML = function(){
			var arr = [],thisData = data.concat().splice(obj.curr*obj.limit - obj.limit, obj.limit);
			layui.each(thisData, function(index, item){
			       arr.push(''+item.number+''+item.code+''+item.hasvalue+''+item.dmac+''+item.ctime+'');
			});
			return arr.join('');
		      }();
		  }
	     });
	})
}