Ajax是一種在不刷新整個頁面的情況下更新部分網(wǎng)頁內(nèi)容的技術，通過異步請求服務器數(shù)據(jù)，從而實現(xiàn)無刷新的頁面更新。在前端應用中，常常需要對列表進行分頁，而Ajax可以幫助我們實現(xiàn)這個功能。

以下是基于jQuery的Ajax實現(xiàn)分頁查詢的示例代碼：

HTML代碼：

<div id="result"></div>

<div id="pagination"></div>

JS代碼：

var pageSize = 10; // 每頁顯示的記錄數(shù)

var currentPage = 1; // 當前頁碼

function loadPage(pageNum) {

  $.ajax({

    type: "GET",

    url: "data.php", // 后端接口地址

    data: {

      pageNum: pageNum,

      pageSize: pageSize

    },

    success: function(data) {

      // 處理后端返回的數(shù)據(jù)

      var resultHtml = ""; // 保存查詢結果的HTML代碼

      // 根據(jù)返回的數(shù)據(jù)生成HTML代碼

      for (var i = 0; i < data.length; i++) {

        resultHtml += "<div>" + data[i].name + "</div>";

      }

      // 顯示查詢結果

      $("#result").html(resultHtml);

      // 更新分頁器

      currentPage = pageNum;

      updatePagination(data.totalCount);

    },

    error: function(xhr, status, error) {

      // 處理錯誤

    }

  });

}

function updatePagination(totalCount) {

  // 計算總頁數(shù)

  var totalPages = Math.ceil(totalCount / pageSize);

  // 生成分頁器HTML代碼

  var paginationHtml = "";

  for (var i = 1; i <= totalPages; i++) {

    if (i === currentPage) {

      paginationHtml += "<span>" + i + "</span>";

    } else {

      paginationHtml += "<a href='javascript:loadPage(" + i + ")'>" + i + "</a>";

    }

  }

  // 顯示分頁器

  $("#pagination").html(paginationHtml);

}

$(function() {

  // 頁面加載完成后，默認加載第一頁數(shù)據(jù)

  loadPage(1);

});

在上述示例代碼中，我們通過Ajax異步請求服務器數(shù)據(jù)，服務器接口返回的數(shù)據(jù)中包含了總記錄數(shù)和當前頁的數(shù)據(jù)，前端JS代碼根據(jù)這些數(shù)據(jù)生成HTML代碼，更新頁面顯示和分頁器。當用戶點擊分頁器時，調(diào)用loadPage()函數(shù)，重新加載相應的數(shù)據(jù)，并更新頁面顯示和分頁器。