效果圖：

API端采用三層架構控制器顯示界面：

UserBll bll = new UserBll();
        //獲取用戶所有信息
        [HttpGet]
        public DataBase GetAll(int pageindex=1,int pagesize=3)
        {
            List<UserInfo> a = bll.GetAll();
            var b = a.Skip((pageindex - 1) * pagesize).Take(pagesize);
            DataBase db 
 
= new DataBase();
            db.users = b.ToList();
            db.PageCount = Convert.ToInt32(Math.Ceiling(a.Count() * 1.0 / pagesize));
            return db;
        }

MVC端視圖界面：

//文檔準備就緒函數
    $(function () {
        lists();
    })
    //
    var MaxPagerCount = 1;
    //顯示信息
    function lists() {
        
 
var pageIndex = $("#PageIndex").val();
        $.ajax({
            url: "http://localhost:51071/api/User",
            type: "get",
            data: { pageIndex: pageIndex },
            success: function (data) {
                //清空tbd
                $("#tbd").empty();
                MaxPagerCount 
 
= data.PageCount;
                for (var item in data.users) {
                    console.log(data.users)
                    //進行拼接
                    $("#tbd").append(
                        "<tr>" +
                        //依次獲取字段
                        "<th><input id=‘Checkbox1‘ class=‘Ck‘ type=‘checkbox‘ value=‘" + data.users[item].Id + "‘ /></th>" +
                        "<th>" + data.users[item].Name + "</th>" +
                        "<th>" + data.users[item].RealName + "</th>" +
                        "<th>" + data.users[item].Telphone + "</th>" +
                        "<th>" + data.users[item].Pass + "</th>" +
                        "<th>" + (data.users[item].Status==0?"禁用":"啟用") + "</th>" +
                        "<th><input id=‘btndel‘ type=‘button‘ value=‘修改‘ onclick=‘Edit(" + data.users[item].Id + ")‘ />" +
                        "<input id=‘btnupdate‘ type=‘button‘ value=‘刪除‘ onclick=‘Delete(" + data.users[item].Id + ")‘ /></th>" +
                        "</tr>");
                }
            }
        });
    }
    //首頁
    function first() {
        $("#PageIndex").val(1);
        lists();
    }
    //尾頁
    function last() {
        $("#PageIndex").val(MaxPagerCount);
        lists();
    }
    //上一頁
    function prev() {
        var pageindex = $("#PageIndex").val() - 1;
        if (pageindex < 1)
            pageindex = 1;

        $("#PageIndex").val(pageindex);
        lists();
    }
    //下一頁
    function next() {
        var pageindex = parseInt($("#PageIndex").val()) + 1;
        if (pageindex > MaxPagerCount)
            pageindex = MaxPagerCount;
        $("#PageIndex").val(pageindex);
        lists();
    }
    first();

MVC中ajax調用API版信息分頁顯示