关于ajax异步请求后台数据进行动态分页

最新推荐文章于 2024-07-30 07:01:07 发布

置顶

东方不败的好朋友

最新推荐文章于 2024-07-30 07:01:07 发布

阅读量1w

点赞数 1

文章标签： ajax 异步前端分页

本文链接：https://blog.csdn.net/u010131415/article/details/47100601

版权

本文介绍如何利用Ajax异步请求从后台获取JSON数据，然后在前端进行动态分页。在success回调中处理数据，确保获取到数据条数、总页数和当前页数。前端需要捕获当前页数，并在请求时传递给后台。注意，为避免默认行为，需设置链接的href属性为"javascript:void(0);"并重新定义点击事件，同时确保点击事件在页面加载完成后再触发，以避免页面未加载完成就发起请求导致无响应。

摘要由CSDN通过智能技术生成

ajax请求后台拿到json类型的数据后，可以在它的success回调方法中进行动态分页，也就是表格重绘，此时，我们需要得到的数据包括：查询得到的数据、数据总条数、总页数、当前页数，其中前三条可在后台获取，对于当前页数，需要从前端获取点击页数再通过请求传递给后台，后台做完相应处理后再传回给前端。
请看如下例子：

/**
     * 
     * @param page 当前页
     */
    function getData(page){
   
        var schoolid = $("#schoolid option:selected").text();
        var apptype = $("#apptype option:selected").text();
        var appname = $("#appname").val();
        $.ajax({
            type : "POST",
            url : "pageAjax",
            dataType : "json",
            data : {
  'schoolid':schoolid,'apptype':apptype,'page':page,'appname':appname},
            success : function(data){
   
                 console.log("成功了！"+data);
                 $("#table").html("");
                 $(".turn_page").html("");