首先我們來分析一下谷歌分頁的實現(xiàn),根據(jù)是實現(xiàn)來計算出他的算法,我們在這里呢,只實現(xiàn)每屏最大顯示數(shù)據(jù)位六頁:如 ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?
?? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?? ? 1 2 3 當前頁是1 1 2 3
1 2 3 4 當前頁是2 起始值1 未頁 4 1 2 3 4 5 當前頁是3 起始值1 未頁 5 1 2 3 4 5 6 當前頁是4 起始值1 未頁 6
?? ? ?
1.首先我們先實現(xiàn)開始時顯示三頁并且當前頁不可點擊,當點擊第二頁是出現(xiàn)第四頁以此類推?
??? ? 從上圖得知 當前頁小于等于4時? 起始頁為1? 末頁=當前頁+2
startindex=1;//為每屏顯示的頁數(shù)的起始索引 endindex=nowpage+2;;//為每屏顯示的頁數(shù)的結(jié)束索引,nowpage當然就是當前頁了
注意: 求和值后的endindex 如果endindex大于總頁數(shù)
那么:?this.endindex=this.countpage;
當點擊第2頁的時候的效果
?當點擊第3頁時
?當點擊第4頁時我們出來第六頁,好現(xiàn)在已經(jīng)是每屏顯示的最大條數(shù)(假如我們現(xiàn)在的總頁數(shù)超過六頁那么我們看第5頁)
那么當超過最大顯示頁數(shù)時,是什么樣的呢,我們先分析一下
?
當大于4時
2 3 4 5 6 7 當前頁是5 起始值是2 未頁 7 3 4 5 6 7 8 當前頁是6 起始值是3 未頁 8 4 5 6 7 8 9 當前頁是7 起始值是4 未頁 9 5 6 7 8 9 10 當前頁是8 起始值是5 未頁 10?
從試圖當中我們不難看出這其中的規(guī)律,所以借下來我我們要實現(xiàn)的功能如圖
?
這是第5頁的現(xiàn)實效果,現(xiàn)在我們可一看到當總頁數(shù)大于每屏最大顯示條數(shù)時,前面的第一頁就消失了
?那么當總最后不足以顯示6頁的時候呢,好,那么我們就從最后一頁開始回顯6條,如圖
?
? ?? 承接上一篇博客
2.那么下面我們就按照上面的分析,來完成實現(xiàn)的算法 首先我們先分析一下分頁用到的變量我們首先要定當前頁,還有總記錄數(shù)和以及每頁顯示條數(shù)和每屏的開始索引和結(jié)束索引,以及總的頁數(shù),和要查詢當前頁的信息,以及每屏顯示的最大頁數(shù)值 定義好了這些下面我們就寫我們的算法
//這是關(guān)于分頁的邏輯計算,算法多多營養(yǎng)多多
if(endindex>lastPage){
endindex=lastPage;//其中endiex是索引結(jié)束,lastPage//是總的頁數(shù) }if(nowPage<=4&&nowPage+2<=lastPage){ endindex=nowPage+2;//nowPage代表當前頁 }if(nowPage>4&&nowPage+2<=lastPage){ startindex=nowPage-3; endindex=nowPage+2; }if(nowPage>4&&nowPage+2>lastPage&&nowPage>=6){ endindex=lastPage; startindex=lastPage-5; }
if(lastPage<=6){//這里的6當然就是每屏顯示的最多頁數(shù)了,當然可以根據(jù)自己的喜好改變也數(shù)那就要改變算法了
if(nowPage>=3)
endindex=nowPage+2>lastPage?lastPage:nowPage+2;
}
?
3.承接上文寫一篇薄竟然要我分散份寫,有么有搞錯,莫非我真的out了嘛 下面我們要說的就是如何實現(xiàn)當點擊某頁的時候連接就變成紅色并且不能再點,其實這個很簡單的啦,只要用標簽去控制連接就可以了,那么下面我們就具體操作一下 我想大家對這個都不算陌生吧,就是判斷點擊的頁數(shù)是不是當前頁如果是,就不顯連接并變成紅色,反之···
<c:forEach begin="${startindex}" end="${endindex}" var="ph">
<c:choose>
<c:when test="${nowPage==ph}"> <a><font color="red"><span>${ph}</span></font></a> </c:when>
<c:otherwise>
<a href="${pageContext.request.contextPath}/studentServlet2?nowPage=${ph}">[<span>${ph}</span>]</a>
</c:otherwise>
</c:choose>
</c:forEach>
好,以上就是仿谷歌分頁的“兔”種算法(一)希望能給大家?guī)睃c點幫助 在這夜深人靜的時刻,我們敲著代碼,讓靈感飛一會,其實我們敲得不是寂寞,是網(wǎng)絡(luò) 在仿谷歌分頁的“兔”種算法(二),我們將把page封裝,并且實現(xiàn)輸入想要查看的頁 數(shù),然后頁面跳轉(zhuǎn)功能 菜菜~~~暴走中~~~未完待續(xù)······
更多文章、技術(shù)交流、商務(wù)合作、聯(lián)系博主
微信掃碼或搜索:z360901061

微信掃一掃加我為好友
QQ號聯(lián)系: 360901061
您的支持是博主寫作最大的動力,如果您喜歡我的文章,感覺我的文章對您有幫助,請用微信掃描下面二維碼支持博主2元、5元、10元、20元等您想捐的金額吧,狠狠點擊下面給點支持吧,站長非常感激您!手機微信長按不能支付解決辦法:請將微信支付二維碼保存到相冊,切換到微信,然后點擊微信右上角掃一掃功能,選擇支付二維碼完成支付。
【本文對您有幫助就好】元
