ajax做分页显示_ajax实现分页：示例代码

Ajax是一种用于在不重新加载整个页面的情况下，通过与服务器进行异步通信来更新部分页面内容的技术。在实现分页显示时，可以使用Ajax来实现动态加载数据，而不需要重新加载整个页面。

在页面加载完成后，可以通过Ajax向服务器发送请求，获取第一页的数据。可以使用jQuery的ajax方法来发送请求，并指定请求的URL、请求的方法（GET或POST）、数据类型（JSON、HTML等）等参数。服务器端可以根据请求的参数来返回相应的数据。

示例代码如下：

$.ajax({
  url: "getData.php?page=1", // 请求的URL，包含分页参数
  method: "GET", // 请求的方法
  dataType: "json", // 返回的数据类型，这里是JSON
  success: function(response) { // 请求成功后的回调函数
    // 处理返回的数据
    // 将数据显示在页面上
  },
  error: function() { // 请求失败后的回调函数
    // 处理请求失败的情况
  }
});

在成功获取到第一页的数据后，可以将数据显示在页面上，例如将数据渲染到一个表格中。可以使用jQuery的append方法将数据添加到表格的tbody中。

示例代码如下：

success: function(response) {
  var tableBody = $("#table tbody"); // 获取表格的tbody元素
  tableBody.empty(); // 清空表格的内容
  // 遍历返回的数据
  $.each(response, function(index, item) {
    // 创建一个新的表格行
    var row = $("<tr></tr>");
    // 创建表格单元格，并将数据添加到单元格中
    var cell1 = $("<td></td>").text(item.name);
    var cell2 = $("<td></td>").text(item.age);
    // 将单元格添加到表格行中
    row.append(cell1, cell2);
    // 将表格行添加到表格的tbody中
    tableBody.append(row);
  });
}

接下来，在页面上添加分页按钮或链接，当用户点击分页按钮或链接时，通过Ajax再次向服务器发送请求，获取下一页的数据。可以通过给分页按钮或链接添加点击事件的方式来实现。

示例代码如下：

$("#nextPage").click(function() {
  var currentPage = 1; // 当前页码
  $.ajax({
    url: "getData.php?page=" + (currentPage + 1), // 请求下一页的URL
    method: "GET",
    dataType: "json",
    success: function(response) {
      // 处理返回的数据
      // 将数据显示在页面上
    },
    error: function() {
      // 处理请求失败的情况
    }
  });
});

以上是使用Ajax实现分页显示的示例代码。通过Ajax，可以在不重新加载整个页面的情况下，动态加载数据并更新页面内容，实现分页显示的效果。