直接上代码：

 <!-- html 引入layui.js和layui.css路径省略 -->
 <table id="fileRetrievalTable" class="layui-table" lay-filter="fileRetrievalTable"></table>
 <div id="pagediv"></div> 

// table 和 ajax 这里没有用到

 layui.use(['table', 'ax','laypage'], function () {
     var $ = layui.$;
     var table = layui.table;
     var $ax = layui.ax;
     var laypage = layui.laypage;
 ​
     var nums = 5; //每页出现的数据量
     var url = Feng.ctxPath + '/fileRetrieval/conditionSearch';
     $.get(url,function(d) {
         // 从后台获取json数据
         var d1 = d.data;
         var render2 = function (d1, curr){
             var arr = []
                 ,thisData = d1.concat().splice(curr*nums-nums, nums);// 按照每页5条进行数据分组
             
             // 拼接表头
             arr.push("<thead>\n" +
                 "                    <tr align=\"center\">\n" +
                 "                        <th  >文件名称</th>\n" +
                 "                        <th  >文件类型</th>\n" +
                 "                        <th  >文件主题</th>\n" +
                 "                        <th  >文件大小</th>\n" +
                 "                        <th  >文件位置</th>\n" +
                 "                        <th  >文件标签</th>\n" +
                 "\n" +
                 "                    </tr>\n" +
                 "                    </thead>")
             
             // 循环拼接 tr td
             layui.each(thisData, function(index, item){
 ​
                 arr.push("<tr>\n" +
                     "                        <td>"+thisData[index].fileName+"</td>\n" +
                     "                        <td>"+thisData[index].fileType+"</td>\n" +
                     "                        <td>"+thisData[index].fileTheme+"</td>\n" +
                     "                        <td>"+thisData[index].fileLabel+"</td>\n" +
                     "                        <td>"+thisData[index].fileSize+"</td>\n" +
                     "                        <td>"+thisData[index].fileLocation+"</td>\n" +
                     "                    </tr>");
             });
             
             // 数组转字符串
             return arr.join('');
         }
         
         laypage.render({
             elem: 'pagediv' 
             ,count: d1.length
             ,limit: 5
             ,limits: [5,10,15]
             ,layout: ['count', 'prev', 'page', 'next', 'limit', 'refresh', 'skip']
             ,jump: function(obj){
                 //$("#fileRetrievalTable").html = render2(d1, obj.curr);
                 document.getElementById('fileRetrievalTable').innerHTML = render2(d1, obj.curr)
             }
         });
     })
 });
 ​

 // var url = Feng.ctxPath + '/fileRetrieval/conditionSearch'; 的json结果
 ​
 {
 ​
     "code":0,
     "count":7,
     "data":[
         {
             "fileLabel":"标签1,标签2",
             "fileLocation":"",
             "fileName":"新建工作表.xls",
             "fileSize":"75KB",
             "fileTheme":"主题三",
             "fileType":"图片",
             "id":""
         },
         {
             "fileLabel":"测试123,啊是",
             "fileLocation":"C/ccc",
             "fileName":"都是",
             "fileSize":"0KB",
             "fileTheme":"主题三",
             "fileType":"视频",
             "id":""
         },
         {
             "fileLabel":"测试123,标签2",
             "fileLocation":"",
             "fileName":"fff",
             "fileSize":"0KB",
             "fileTheme":"主题三",
             "fileType":"PDF",
             "id":""
         },
         {
             "fileLabel":"测试123,标签2",
             "fileLocation":"",
             "fileName":"dffd",
             "fileSize":"0KB",
             "fileTheme":"主题三",
             "fileType":"图片",
             "id":""
         },
         {
             "fileLabel":"标签1,标签2",
             "fileLocation":"",
             "fileName":"新建工作表.xls",
             "fileSize":"75KB",
             "fileTheme":"主题三",
             "fileType":"图片",
             "id":""
         },
         {
             "fileLabel":"标签1,标签2",
             "fileLocation":"",
             "fileName":"新建工作表.xls",
             "fileSize":"75KB",
             "fileTheme":"主题三",
             "fileType":"图片",
             "id":""
         },
         {
             "fileLabel":"标签1,标签2",
             "fileLocation":"/AAA/新建工作表.xls",
             "fileName":"新建工作表.xls",
             "fileSize":"76KB",
             "fileTheme":"主题三",
             "fileType":"图片",
             "id":""
         }
     ],
     "msg":"请求成功"
 ​
 }
 ​

结果展示：

标签：thisData,分页,layui,前端,fileTheme,fileName,fileSize,标签,var
来源： https://www.cnblogs.com/hippo-dolphin/p/15174655.html