如何创建json显示数据的分页？

早上好

今天我尝试在我的网站上制作一个实时搜索PHP+MySQL+Json程序，有时候很难，因为我不知道很多Json代码

网址：

我正在显示包含以下代码的信息的表：

<script>

  function makeTable(data){
   var tbl_body = "";
      $.each(data, function() {
        var tbl_row = "";
        $.each(this, function(k,v)
        {
            tbl_row += "<td>"+v+"</td>";
        })
        tbl_body += "<tr>"+tbl_row+"</tr>";         
      })


    return tbl_body;
  }

  function getEmployeeFilterOptions(){
    var opts = [];
    $checkboxes.each(function(){
      if(this.checked){
        opts.push(this.name);
      }
    });

    return opts;
  }

  function updateEmployees(opts){
    $.ajax({
      type: "POST",
      url: "submit.php",
      dataType : 'json',
      cache: false,
      data: {filterOpts: opts},
      success: function(records){
        $('#employees tbody').html(makeTable(records));
      // here, after the content is inside DOM/visible we activate the plugin
        $('#employees').dataTable({
            "paging":   true,
            "ordering": false,
            "info":     false
        });
      }
    });
  }

  var $checkboxes = $("input:checkbox");
  $checkboxes.on("change", function(){
    var opts = getEmployeeFilterOptions();
    updateEmployees(opts);
  });

  updateEmployees();
</script>

问题是，我需要限制结果并进行分页，因为目前它显示了很多条目，而且卷轴很重

我该怎么做

谢谢，非常感谢

---

这不是json的问题，您只需要一个工具来显示您的表。 我使用jquery。它支持分页、排序、筛选以及每页的条目数。它的使用和配置非常简单：

将以下内容添加到您的页面：

使用完整的结果集，像现在一样创建表，还记得thead和tfoot吗

使用以下命令激活此表上的插件：

$(document).ready(function() {
    $('#example').dataTable( {
        "paging":   false,
        "ordering": false,
        "info":     false
    } );
} );

更新： 调用makeTable后，您必须通过将该表放入一个元素来显示该表，例如，现在才可以激活插件

function updateEmployees(opts){
    $.ajax({
      type: "POST",
      url: "submit.php",
      dataType : 'json',
      cache: false,
      data: {filterOpts: opts},
      success: function(records){
        $('#employees tbody').html(makeTable(records));
      // here, after the content is inside DOM/visible we activate the plugin
        $('#employees').dataTable({
            "paging":   true,
            "ordering": true,
            "info":     true
        });
      }
    });
  }

---

!！重要的是，请记住用AD和tbody标签填写完整的表格

谢谢萨沙，但我现在迷路了。我已经用我的JQuery代码更新了我的第一条消息，因为我不知道把你给我的代码放在哪里。。。！问候。这就是我现在得到的：哦，你成功了。由于配置原因，您看不到分页，请将“真”设置为“分页”，并使用其他2个字段“排序”和“信息”。$'myTable'.dataTable{paging:true，ordering:false，info:false}；这是因为在加载页面后立即激活插件，现在看到更新，注意在updateEmployeesopts中，在显示内容后立即激活插件。我刚刚搜索了jquery select change，并在第二个结果中找到了该链接：