困惑了我一段时间的网页分页，今天特地整理了一下我完成不久的项目。下面我要分享下我这个项目的分页代码，前后端通吃。希望前辈多多指教。

一、效果图

下面我先上网页前台和管理端的部分分页效果图，他们用的是一套代码。

二、上代码前的一些知识点

此jQuery插件为埃阿斯分页插件，一次性加载，故分页切换时无刷新与延迟，如果数据量较大不建议用此方法，因为加载会比较慢。

三、前台代码部分

var page SiZe=6；//每页显示多少条记录定义变量总计；//总共多少记录$(function(){ Init(0)；//注意参数，初始页面默认传到后台的参数，第一页是0;$(' #分页').分页（总计，{//总计不能少callback: PageCallback，prev_text: '上一页，next_text: '下一页，items_per_page: pageSize，num _ display _ entries: 4，//连续分页主体部分显示的分页条目数num _ edge _ entries: 1，//两侧显示的首尾分页的条目数});函数PageCallback(index，jq) { //前一个表示您当前点击的那个分页的页数索引值，后一个参数表示装载容器Init(索引);} });函数Init(pageIndex){ //这个参数就是点击的那个分页的页数索引值，第一页为0,上面提到了，下面这部分就是创建交互式、快速动态网页应用的网页开发技术传值了。 $.ajax({ type: 'post '，url: './getContentPaixuServ？cat=' str ' rows=' page size ' page=' page index，async: false，dataType: 'json '，success: function (data) { $().内荣')。empty()；/*总计=数据。总计；*/var数组=数据。行；for(var I=0；IAR ray . LengiI){ var info=array[I]；if(info.refPic！=null){ $(' .内荣')。追加(' dlh3a href=')信息CntURL？内容id=' info。内容id“title=”信息。标题' ' '信息。标题/a/H3JSP？内容id=' info。内容id“title=”信息。标题“img src=”http :%=BasePathPic %”信息。ref pic“alt=”信息。caption ' width=' 150 ' height=' 95 ' '/a/dt DD class=' short DD ' ' info。文本'/DD范围发布时间：'信息。创建日期'/span/dl ')}其他{ $(' .内荣')。追加(' dl h3a href=')信息CntURL？内容id=' info。内容id“title=”信息。标题' ' '信息。标题'/a/h3dd class='短dd ' '信息。文本'/DD范围发布时间：'信息。创建日期'/span/dl ')；};} }，error: function () { alert('请求超时，请重试！');} });};四、后台部分(java)我用的是MVC 3层模型

小型应用程序部分： (可以跳过)

public void doPost(HttpServletrequest请求，HttpServletResponse响应)引发ServletException，IOException { response。setcontenttype(' text/html；charset=utf-8 ')；PrintWriter out=响应。getwriter()；//获取分页参数字符串p=请求。GetParameter(' page ')；//当前第几页（点击获取)int page=integer。par sent(p)；字符串行=请求。GetParameter(' row ')；//每页显示多少条记录int rows=Integer.parseInt(行);字符串s=请求。GetParameter(' Cat ')；//栏目标识整数索引标识=整数。解析整数；JSONObject对象=(新内容服务()).getcontentpaixubiid(indexId，页，行);out.print(对象);出去。flush()；出去。close()；}服务部分：(可以跳过)

公共JSON对象getContentPaiXuById(int indexId，int page，int row){ JSON数组array=new JSON数组()；listcontentcontentlist 1=(新内容Dao()).selectIndexById(indexId)；ListContentcontentlist=分页内容(内容列表1，页，行);for(Content Content : Content list){ JSON对象对象=新JSON对象()；object.put('contentId '，content)。get content id())；object.put('caption '，content)。getcaption())；object.put('createDate '，内容。getcreatedate())；object.put('times '，string。(内容)的价值。gettimes()))；object.put('source '，content)。getsource())；object.put('text '，content)。gettext())；object.put('pic '，content)。getpic())；object.put('refPic '，内容。GetRefPic())；object.put('hot '，内容。gethot())；object.put('userId '，content.getAuthorId().getUserId())；int id=content.getAuthorId().getUserId()；字符串ShowName=(新用户服务())。选择用户名(身份证).getString('显示名称')；object.put('showName '，show name)；array.add(对象);} JSON对象obj=new JSON对象()；obj.put('total '，内容列表1。size())；物体。put(' row '，array)；返回对象；}获取出每页的的起止id(这部分是重点),同样写在服务中，比如说假设一页有6条内容，那么第一页的编号是从一到6,第二页的编号是从七到12,以此类推

//获取出每页的内容从哪个身份开始到哪个身份结束私有列表内容分页内容（列表内容列表，int page，int rows){ 0列表内容小=新数组列表内容();int beginIndex=rows * page//行是每页显示的内容数，第页就是我前面强调多次的点击的分页的页数的索引值，第一页为0,这样子下面就好理解了！系统。出去。println(Beginindex)；int endIndexif(行*(第一页)列表。size()){ endIndex=list。size()；} else{ endIndex=rows*(第一页);} for(int I=BeginIndex；iendIndexI){小。添加(列表。get(I))；}返小；}道层： (可以跳过)

public List selectIndexById(int indexId){ ListContentlist=new ArrayList content()；尝试{ conn=dbconn。getcon()；字符串sql='从内容中选择*用户，其中内容授权=用户.使用者辩证码和CatlogId=？"订单由desc创建日期";pstm=conn . prepare statement(SQL)；pstm.setInt(1，indexId)；RS=pstm。execute query()；简单日期格式ff=新的简单日期格式(' yyyy年梅智节拍器月截止日期(截止日期的缩写)日倍硬时毫米分');而(RS。next()){内容内容=新内容()；内容。setcontent id(RS。getint(' content id ')；内容。setcaption(RS。getstring(' Caption ')；内容。setcreatedate(f . format(RS。gettimestamp(' create date '))；内容。设置时间。getint(' Times ')；内容。setsource(RS。getstring(' Source ')；内容。settext(RS。getstring(' Text ')；内容。设定点。getString(' Pic ')；内容。setrefpic(RS。GetString(' RefPic ')；内容。sethot(RS。GetInt(' Hot ')；用户用户=新用户();用户。setuserid(RS。GetInt(' UserId ')；content.setAuthorId(用户);Catlog Catlog=new Catlog()；//CntURL待开发catlog。setcatlogid(RS。getint(' CatlogId ')；内容。setcatlog(catlog)；list.add(内容);} }catch(异常e){ e . print stack trace()；}最后{ DBConn.closeDB(conn，pstm，RS)；}返回列表；}精彩专题分享：jquery分页功能操作Java脚本语言分页功能操作

以上就是网页所实现的分页代码简单的用户界面部分的分页也可以参考以上代码。