首页 > 代码库 > 遥控器原理的分页
遥控器原理的分页
索引：前几天看电视，使用遥控器的时候突然想到，我们的数据分页也可以用这种模式。于是敲出来一个类似于遥控器控制电视原理的分页。
现在详细介绍下上图中按钮的作用：
清除按钮：
当按下0-9这个几个按钮时，如果有按错在指定时间内可以单击清除来清除按下的所以按键。
0-9按扭，类似遥控器上的0-9按钮，没点击一个数字，后台都有一个变量记录，并以字符串的方式累加。在指定时间内会跳转到累加的数字上。比如点击1和4则会跳转到第14页，如果没有那么多页，则会跳转到最后一页。
To按钮：这是除了程序自动跳转外，点击To按钮可以立即跳转，不用等进度条读完。
To下的进度条：显示自动跳转的进度。
下一批：功能同正常分页的下一页一样
上一批：功能同正常分页的上一页一样。
优点：可以免去正常分页的繁琐，用户体验好。
缺点：要自己点击，或者等指定的时间。
html代码：
<div id="wp_cp"> @if (pi > 1){ <div id="wp_prev" onclick="Javascript:location.href=http://www.mamicode.com/‘/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" onclick="Javascript:location.href=http://www.mamicode.com/‘/Wall/WallNote?height=@clientY&width=@clientX&pi=@(pi+1)‘">下一批</div> } 共<font>@pi/<a href=http://www.mamicode.com/"/Wall/WallNote?height=@clientY&width=@clientX&pi=@mcount">@mcount</a>页</font> <br/> <br/>
这个写起来也不麻烦，就不上全部代码了。
遥控器原理的分页
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。