索引：前幾天看電視，使用遙控器的時候突然想到，我們的數(shù)據(jù)分頁也可以用這種模式。于是敲出來一個類似于遙控器控制電視原理的分頁。

現(xiàn)在詳細介紹下上圖中按鈕的作用：

清除按鈕：當按下0-9這個幾個按鈕時，如果有按錯在指定時間內(nèi)可以單擊清除來清除按下的所以按鍵。

0-9按扭，類似遙控器上的0-9按鈕，沒點擊一個數(shù)字，后臺都有一個變量記錄，并以字符串的方式累加。在指定時間內(nèi)會跳轉到累加的數(shù)字上。比如點擊1和4則會跳轉到第14頁，如果沒有那么多頁，則會跳轉到最后一頁。

To按鈕：這是除了程序自動跳轉外，點擊To按鈕可以立即跳轉，不用等進度條讀完。

To下的進度條：顯示自動跳轉的進度。

下一批：功能同正常分頁的下一頁一樣

上一批：功能同正常分頁的上一頁一樣。

優(yōu)點：可以免去正常分頁的繁瑣，用戶體驗好。

缺點：要自己點擊，或者等指定的時間。

html代碼：

<div id="wp_cp">@if (pi > 1) {<div id="wp_prev" οnclick="Javascript:location.href='/Wall/WallNote?height=@clientY&width=@clientX&pi=@(pi-1)'">上一批</div> } <font id="wp_cm">清除</font><br/><span>1</span><span>2</span><br/><span>3</span><span>4</span><br /><span>5</span><span>6</span><br /><span>7</span><span>8</span><br /><span>9</span><span>0</span><br /><div id="ws_tiao">To</div><div style="height:10px;background-color:#4cff00;width:0px;display:none;"></div>@if(pi<mcount){<div id="wp_next" οnclick="Javascript:location.href='/Wall/WallNote?height=@clientY&width=@clientX&pi=@(pi+1)'">下一批</div>}共<font>@pi/<a href="/Wall/WallNote?height=@clientY&width=@clientX&pi=@mcount">@mcount</a>頁</font><br/><br/>

這個寫起來也不麻煩，就不上全部代碼了。

轉載于:https://www.cnblogs.com/caoxianbing/p/4209145.html

總結

以上是生活随笔為你收集整理的遥控器原理的分页的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。