JQuery实现简单分页（DataTable,pagination）

DataTable分页（前端分页，后台不需要任何处理）

 $('#tblResult').DataTable({
                            // columnDefs:[{ orderable:false, targets:[0]   }] ,
                            aaSorting: [[0, 'asc']],
                            paging: true,//分頁
                            searching: false,//不搜索
                            scrollY: 380,//垂直滾動
                            pageLength: 10,//显示多少条数据
                            lengthChange: true,//可以選擇是否開啟
                            lengthMenu: [    //可以選擇的內容
                                [5, 10, 20, -1],
                                ['5条', '10条', '20条', '全部']
                            ],
                            language: {                              // 这是修改语言的显示
                                paginate: {
                                    first: "首條",
                                    previous: "前一頁",
                                    next: "下一頁",
                                    last: "，末頁"
                                },
                                lengthMenu: "每頁顯示 _MENU_ 項結果"
                            },
                            data: $.parseJSON(r),//數據源
                            columns: [{ data: 'FATP_WORK' }, { data: 'FATP_MODEL' }
                            ]
                        });

pagination分页（主要用插件渲染页数和翻页动作，其他通过后台索引分页）

//初始化数据
$("#pagingArea").pagination({
                items: 0,
                itemsOnPage: 10,
                cssStyle: 'light-theme',
                onPageClick: function () { var idx = $("#pagingArea").pagination('getCurrentPage'); LargeBoardQuery.fillDetail(idx); }
            });




//执行LargeBoardQuery.fillDetail后台方法返回值
function (result) {
                    var data = $.parseJSON(result);
                    $("#tblYield tr:not(:first)").remove();//刷新之后移除前一页内容；
                    if (data.length == 0) {

                        $("#tblYield").append("<tr><td colspan='12' style='text-align:center'><strong>No Data Found</strong></td></tr>");
                    } else {
                        $("#pagingArea").pagination('updateItems', data[0].NUM);
                    }
                    $.each(data, function (i, o) {
                        var htmtxt = "<tr><td>" + (i + 1 + (idx - 1) * 10) + "</td>";
                       
                        htmtxt += "<td >" + o.DEPT_CODE + "</td>";
                        htmtxt += "<td >" + o.CREATED_BY + "</td>";
                        htmtxt += "<td >" + o.CREATED_TIME.replace("T", "  ") + "</td>";
                       
                        $("#tblYield").append(htmtxt);
                    });
                    App.unblockUI($("#divSearch"));
                });

后台（因为有pagination进行渲染，所以偷了下懒，只传输了页数page，其他在pagination中进行配置。）

public DataSet CallLargeBoardInfo(string model, string fromTime, string toTime, string page)
        {
            int lpage_start = 0;
            int lpage_end = 0;
            model = model.Replace(",", "','");
            string sql = "SELECT rownum t,(select count(*) from TableName) NUM,a.* FROM TableNamea ";
            if (!string.IsNullOrEmpty(page))
            {
                lpage_start = (int.Parse(page) - 1) * 10 + 1;
                lpage_end = int.Parse(page) * 10;
                sql += "AND rownum <= " + lpage_end + "";
                sql = "select * from (" + sql + ") where t>=" + lpage_start + "";
            }
            DataSet menus = DBContext.ExcuteSql(sql).ToDataSet();
            return menus;
        }

DataSet数据传输到前端需要转换。

return Newtonsoft.Json.JsonConvert.SerializeObject(menus.Tables[0]);