总体思想就是,每组分页栏显示5个页码,用 模五的方法来分隔每组分页,同时根据当前页码与总页数之差来决定是否显示后一页、后N页的页码tab,以及省略号
大致如下:
共10条记录 前一页 6,7,8,9,10……12 后一页
共7条记录 前一页 1,2,3,4,5……7 后一页
共6条记录 前一页 1,2,3,4,5…… 后一页
共5条记录 前一页 1,2,3,4,5 后一页
共4条记录 前一页 1,2,3,4 后一页
共3条记录 前一页 1,2,3 后一页
共2条记录 前一页 1,2 后一页
共1条记录 1
<ul class="pager">
<!-- 控制分页导航的显示 -->
<s:if test="TotalPage>0"> <!-- 若歌曲查询结果非空,显示分页导航及“第1页” -->
<s:if test="pageNo<2"> <!-- 若当前页面为第一页 -->
<li class="disabled">« 前一页 </li> <!-- 灰掉“前一页” -->
</s:if>
<s:elseif test="pageNo>1"> <!-- 若当前页面非第一页 -->
<li><a href="songSearch?pageNo=${pageNo-1}&title=${title}">« 前一页</a></li> <!-- 显示“前一页” -->
</s:elseif>
<s:if test="pageNo%5==1"> <!-- 若当前页数 mod 5 结果为 1,即:pageNo 除以 5 余 1 -->
<li class="current"><a href="songSearch?pageNo=${pageNo}&title=${title}">${pageNo}</a></li><!-- 显示“当前页” -->
<s:if test="pageNo+1<=TotalPage"> <!-- 若1页后未达到末页,显示“第pageNo+1页” -->
<li><a href="songSearch?pageNo=${pageNo+1}&title=${title}">${pageNo+1}</a></li><!-- 显示“第pageNo+1页” -->
<s:if test="pageNo+2<=TotalPage"> <!-- 若2页后未达到末页,显示“第pageNo+1页” -->
<li><a href="songSearch?pageNo=${pageNo+2}&title=${title}">${pageNo+2}</a></li><!-- 显示“第pageNo+2页” -->
<s:if test="pageNo+3<=TotalPage"> <!-- 若3页后未达到末页,显示“第pageNo+1页” -->
<li><a href="songSearch?pageNo=${pageNo+3}&title=${title}">${pageNo+3}</a></li> <!-- 显示“第pageNo+3页” -->
<s:if test="pageNo+4<=TotalPage"> <!-- 若4页后未达到末页,显示“第pageNo+1页” -->
<li><a href="songSearch?pageNo=${pageNo+4}&title=${title}">${pageNo+4}</a></li> <!-- 显示“第pageNo+4页” -->
<s:if test="pageNo+5<=TotalPage"> <!-- 若5页后未达到末页,显示“省略符” -->
<li class="separator">...</li> <!-- 显示省略符 -->
<s:if test="pageNo+6<=TotalPage"> <!-- 若6页后未达到末页,显示“最末页” -->
<li><a href="songSearch?pageNo=${TotalPage}&title=${title}">${TotalPage}</a></li> <!-- 显示“最末页” -->
</s:if>
</s:if>
</s:if>
</s:if>
</s:if>
</s:if>
</s:if>
<s:if test="pageNo%5==2"> <!-- 若当前页数 mod 5 结果为 2,即:pageNo 除以 5 余 2 -->
<li><a href="songSearch?pageNo=${pageNo-1}&title=${title}">${pageNo-1}</a></li> <!-- 显示“第pageNo-1页” -->
<li class="current"><a href="songSearch?pageNo=${pageNo}&title=${title}">${pageNo}</a></li> <!-- 显示“当前页” -->
<s:if test="pageNo+1<=TotalPage"> <!-- 若1页后未达到末页,显示“第pageNo页” -->
<li><a href="songSearch?pageNo=${pageNo+1}&title=${title}">${pageNo+1}</a></li> <!-- 显示“第pageNo+1页” -->
<s:if test="pageNo+2<=TotalPage"> <!-- 若2页后未达到末页,显示“第pageNo+1页” -->
<li><a href="songSearch?pageNo=${pageNo+2}&title=${title}">${pageNo+2}</a></li> <!-- 显示“第pageNo+2页” -->
<s:if test="pageNo+3<=TotalPage"> <!-- 若2页后未达到末页,显示“第pageNo+2页” -->
<li><a href="songSearch?pageNo=${pageNo+3}&title=${title}">${pageNo+3}</a></li> <!-- 显示“第pageNo+3页” -->
<s:if test="pageNo+4<=TotalPage"> <!-- 若3页后未达到末页,显示“第pageNo+3页” -->
<li class="separator">...</li> <!-- 显示省略符 -->
<s:if test="pageNo+5<=TotalPage"> <!-- 若4页后未达到末页,显示“最末页” -->
<li><a href="songSearch?pageNo=${TotalPage}&title=${title}">${TotalPage}</a></li> <!-- 显示“最末页” -->
</s:if>
</s:if>
</s:if>
</s:if>
</s:if>
</s:if>
<s:if test="pageNo%5==3"> <!-- 若当前页数 mod 5 结果为 3,即:pageNo 除以 5 余 3 -->
<li><a href="songSearch?pageNo=${pageNo-2}&title=${title}">${pageNo-2}</a></li> <!-- 显示“第pageNo-2页” -->
<li><a href="songSearch?pageNo=${pageNo-1}&title=${title}">${pageNo-1}</a></li> <!-- 显示“第pageNo-1页” -->
<li class="current"><a href="songSearch?pageNo=${pageNo}&title=${title}">${pageNo}</a></li> <!-- 显示“当前页” -->
<s:if test="pageNo+1<=TotalPage"> <!-- 若1页后未达到末页,显示“第pageNo+1页” -->
<li><a href="songSearch?pageNo=${pageNo+1}&title=${title}">${pageNo+1}</a></li> <!-- 显示“第pageNo+1页” -->
<s:if test="pageNo+2<=TotalPage"> <!-- 若2页后未达到末页,显示“第pageNo+2页” -->
<li><a href="songSearch?pageNo=${pageNo+2}&title=${title}">${pageNo+2}</a></li> <!-- 显示“第pageNo+2页” -->
<s:if test="pageNo+3<=TotalPage"> <!-- 若3页后未达到末页,显示“省略符” -->
<li class="separator">...</li> <!-- 显示省略符 -->
<s:if test="pageNo+4<=TotalPage"> <!-- 若4页后未达到末页,显示“最末页” -->
<li><a href="songSearch?pageNo=${TotalPage}&title=${title}">${TotalPage}</a></li> <!-- 显示“最末页” -->
</s:if>
</s:if>
</s:if>
</s:if>
</s:if>
<s:if test="pageNo%5==4"> <!-- 若当前页数 mod 5 结果为 4,即:pageNo 除以 5 余 4 -->
<li><a href="songSearch?pageNo=${pageNo-3}&title=${title}">${pageNo-3}</a></li> <!-- 显示“第pageNo-3页” -->
<li><a href="songSearch?pageNo=${pageNo-2}&title=${title}">${pageNo-2}</a></li> <!-- 显示“第pageNo-2页” -->
<li><a href="songSearch?pageNo=${pageNo-1}&title=${title}">${pageNo-1}</a></li> <!-- 显示“第pageNo-1页” -->
<li class="current"><a href="songSearch?pageNo=${pageNo}&title=${title}">${pageNo}</a></li> <!-- 显示“当前页” -->
<s:if test="pageNo+1<=TotalPage"> <!-- 若1页后未达到末页,显示“第pageNo+1页” -->
<li><a href="songSearch?pageNo=${pageNo+1}&title=${title}">${pageNo+1}</a></li> <!-- 显示“第pageNo+1页” -->
<s:if test="pageNo+2<=TotalPage"> <!-- 若2页后未达到末页,显示“省略符” -->
<li class="separator">...</li> <!-- 显示省略符 -->
<s:if test="pageNo+3<=TotalPage"> <!-- 若3页后未达到末页,显示“最末页” -->
<li><a href="songSearch?pageNo=${TotalPage}&title=${title}">${TotalPage}</a></li> <!-- 显示“最末页” -->
</s:if>
</s:if>
</s:if>
</s:if>
<s:if test="pageNo%5==0"> <!-- 若当前页数 mod 5 结果为 0,即:pageNo 除以 5 余 0 -->
<li><a href="songSearch?pageNo=${pageNo-4}&title=${title}">${pageNo-4}</a></li> <!-- 显示“第pageNo-4页” -->
<li><a href="songSearch?pageNo=${pageNo-3}&title=${title}">${pageNo-3}</a></li> <!-- 显示“第pageNo-3页” -->
<li><a href="songSearch?pageNo=${pageNo-2}&title=${title}">${pageNo-2}</a></li> <!-- 显示“第pageNo-2页” -->
<li><a href="songSearch?pageNo=${pageNo-1}&title=${title}">${pageNo-1}</a></li> <!-- 显示“第pageNo-1页” -->
<li class="current"><a href="songSearch?pageNo=${pageNo}&title=${title}">${pageNo}</a></li> <!-- 显示“当前页” -->
<s:if test="pageNo+1<=TotalPage"> <!-- 若1页后未达到末页,显示“省略符” -->
<li class="separator">...</li> <!-- 显示省略符 -->
<s:if test="pageNo+2<=TotalPage"> <!-- 若2页后未达到末页,显示“最末页” -->
<li><a href="songSearch?pageNo=${TotalPage}&title=${title}">${TotalPage}</a></li> <!-- 显示“最末页” -->
</s:if>
</s:if>
</s:if>
</s:if>
<s:if test="pageNo.equals(TotalPage)"> <!-- 若当前页面为第一页 -->
<li class="disabled">后一页 » </li> <!-- 灰掉“前一页” -->
</s:if>
<s:elseif test="pageNo<TotalPage"> <!-- 若当前页面非第一页 -->
<li><a href="songSearch?pageNo=${pageNo+1}&title=${title}">后一页 »</a></li> <!-- 显示“前一页” -->
</s:elseif>
</ul>
嗯……直接贴代码呗……欢迎各位大神各种喷……
此代码打算过两天期末考试结束了再弄个循环啥的……然后再优化优化……
也欢迎各位大神给予指点~~
效果图:
这排版似乎有点问题=- =-
迅
Dalston
2012-2-28
===============================================
不断改进完善中……
在
<s:elseif test="pageNo>1"> <!-- 若当前页面非第一页 -->
<li><a href="songSearch?pageNo=${pageNo-1}&title=${title}">« 前一页</a></li> <!-- 显示“前一页” -->
</s:elseif>
和
<s:if test="pageNo%5==1">
之间添加了一段以下代码,实现了——超过5页后,显示定位到首页的导航tab~
<s:if test="pageNo-5>=1"> <!-- 若退5页未达到首页,显示“第1页”及“省略符” -->
<li><a href="songSearch?pageNo=1&title=${title}">1</a></li> <!-- 显示“第1页” --> <li class="separator">...</li> <!-- 2012-3-1 ,added By XX -->
</s:if>
迅
Dalston
2012-3-1