困惑了我一段时间的网页分页，今天特地整理了一下我完成不久的项目。下面我要分享下我这个项目的分页代码，前后端通吃。希望前辈多多指教。
一、效果图
下面我先上网页前台和管理端的部分分页效果图，他们用的是一套代码。
二、上代码前的一些知识点
此jQuery插件为Ajax分页插件，一次性加载，故分页切换时无刷新与延迟，如果数据量较大不建议用此方法，因为加载会比较慢。
三、前台代码部分
var pageSize =6; //每页显示多少条记录 var total; //总共多少记录 $(function() { Init(0); //注意参数，初始页面默认传到后台的参数，第一页是0; $("#Pagination").pagination(total, { //total不能少 callback: PageCallback, prev_text: '上一页', next_text: '下一页', items_per_page: pageSize, num_display_entries: 4, //连续分页主体部分显示的分页条目数 num_edge_entries: 1, //两侧显示的首尾分页的条目数 }); function PageCallback(index, jq) { //前一个表示您当前点击的那个分页的页数索引值，后一个参数表示装载容器。 Init(index); } }); function Init(pageIndex){ //这个参数就是点击的那个分页的页数索引值，第一页为0，上面提到了，下面这部分就是AJAX传值了。 $.ajax({ type: "post", url:"../getContentPaixuServ?Cat="+str+"&rows="+pageSize+"&page="+pageIndex, async: false, dataType: "json", success: function (data) { $(".neirong").empty(); /* total = data.total; */ var array = data.rows; for(var i=0;i<array.length;i++){ var info=array[i]; if(info.refPic != null){ $(".neirong").append('<dl><h3><a href="'https://www.jb51.net/+info.CntURL+'?ContentId='+info.contentId+'" title="'+info.caption+'" >'+info.caption+'</a></h3><dt><a href="sjjm.jsp?ContentId='+info.contentId+'" title="'+info.caption+'" ><img src="<%=basePathPic%>'+info.refPic+'" alt="'+info.caption+'"></a></dt> <dd>'+info.text+'</dd><span>发布时间：'+info.createDate+'</span></dl>') }else{ $(".neirong").append('<dl ><h3><a href="'https://www.jb51.net/+info.CntURL+'?ContentId='+info.contentId+'" title="'+info.caption+'" >'+info.caption+'</a></h3><dd>'+info.text+'</dd><span>发布时间：'+info.createDate+'</span></dl>'); }; } }, error: function () { alert("请求超时，请重试！"); } }); };
四、后台部分（java）
我用的是MVC 3层模型
servlet部分： （可以跳过）
public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("text/html;charset=utf-8"); PrintWriter out = response.getWriter(); //获取分页参数 String p=request.getParameter("page"); //当前第几页（点击获取） int page=Integer.parseInt(p); String row=request.getParameter("rows"); //每页显示多少条记录 int rows=Integer.parseInt(row); String s=request.getParameter("Cat"); //栏目ID int indexId=Integer.parseInt(s); JSONObject object=(new ContentService()).getContentPaiXuById(indexId, page, rows); out.print(object); out.flush(); out.close(); }
Service部分：（可以跳过）
public JSONObject getContentPaiXuById(int indexId, int page, int rows) { JSONArray array=new JSONArray(); List<Content>contentlist1=(new ContentDao()).selectIndexById(indexId); List<Content>contentlist=paginationContent(contentlist1,page,rows); for(Content content:contentlist){ JSONObject object=new JSONObject(); object.put("contentId", content.getContentId()); object.put("caption", content.getCaption()); object.put("createDate", content.getCreateDate()); object.put("times", String.valueOf(content.getTimes())); object.put("source", content.getSource()); object.put("text", content.getText()); object.put("pic", content.getPic()); object.put("refPic", content.getRefPic()); object.put("hot", content.getHot()); object.put("userId", content.getAuthorId().getUserId()); int id = content.getAuthorId().getUserId(); String ShowName = (new UserService()).selectUserById(id).getString("ShowName"); object.put("showName", ShowName); array.add(object); } JSONObject obj=new JSONObject(); obj.put("total", contentlist1.size()); obj.put("rows", array); return obj; }
获取出每页的的起止id（这部分是重点），同样写在Service中，比如说假设一页有6条内容，那么第一页的id是从1到6，第二页的id是从7到12，以此类推