使用pager插件实现分页简易使用示例（后台分页，前台显示）

1.简介

对于页面分页，总的来讲分为两种，一种是前台页面的分页，一种是后台的分页，下面主要是介绍分页的思想。

前端分页：

        所谓前端分页，顾名思义，分页的效果是前端页面显示。这种分页，通常是一次性查出需要展示分页的所有内容，前端页面需要将页码和每页展示条数传递给控制器，控制器通过每页展示条数将查处的集合进行截取，从而达到分页效果。（当数据量较大时则不建议使用）

后端分页：

        是数据库只查询出当前页需要展示的数据。每次点击页数的时候将点击的页数作为参数当前页传递到后台服务器端。服务器端经过nowpage和pagesize的一定算法将其他参数(例如pagecount,startrow,endrow)等分页需要的属性计算出来。然后将startrow和endrow应用到查询的限制条数上。以查出来本页所需要的数据。在此同时更新了当前页等参数之后在服务器将page对象传递到前台更新分页情况展现。

今天展示的是后台分页前端展示的一个小插件——pager

2.代码

部分css、html、js

//表格



//分页


跳转到
 

页

共计:条
确定 

js：

function getSendMessageInfo() {    //初始化首页显示                                                                         var paramObj = {
        "pageNum":"1",
        "pageSize":"10"
    };
    //法律信息
    $.ajax({
        url:  httpurl+'/news/selectNewAll',
        type: 'POST',
        dataType: 'json',
        contentType: "application/json",
        async: false,
        data: JSON.stringify(paramObj),
        success: function (result) {

            if (result.code=='666'){
                 if (result.data.list.length>0){
                     addLawInfo(result.data.list);//添加数据
                     changepagelaw(result.data.total,result.data.pages)//分页显示（总条数，总页数）
                 }
            }else {
                alert("出现未知错误")
            }
        },
        error: function (XMLHttpRequest, textStatus) {
            alert(XMLHttpRequest.status);
            alert(XMLHttpRequest.readyState);
            alert(textStatus);
        }
    })

}
/*分页*/
function changepagelaw(total,page) {
  
    $("#totallawNum").html(total)
    Page({
        num:page,               //页码数
        startnum:1,            //指定页码
        elem:$('#pagelaw'),     //指定的元素
        callback:function(n){  //回调函数 n为number类型所以需要转为String类型
            var pageNum = n.toString()
            getSendMessageInfo2(pageNum);
        }
    });
}