遥控器原理的分页
索引:前幾天看電視,使用遙控器的時候突然想到,我們的數(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
總結
- 上一篇: Java 基础——类的加载
- 下一篇: 特斯拉造芯片:不能失去集成电路的高地,就