Jquery简单分页实现方法


Posted in Javascript onJuly 24, 2015

本文实例讲述了Jquery简单分页实现方法。分享给大家供大家参考。具体如下:

js代码:

function dolistpage(pagerow,pagenum,rowcount,pagecount){
 $("#pagemsg").html("每页显示"+pagerow+"条,当前" + pagenum + "/" +pagecount + "页 共" +rowcount + "条");
 if (pagenum == 1) {
  $("#fpbtn").attr("disabled", true);
  $("#rpbtn").attr("disabled", true);
 }else {
  $("#fpbtn").removeAttr("disabled");
  $("#rpbtn").removeAttr("disabled");
 }
 if (pagenum == pagecount) {
  $("#npbtn").attr("disabled", true);
  $("#lpbtn").attr("disabled", true);
 }else {
  $("#npbtn").removeAttr("disabled");
  $("#lpbtn").removeAttr("disabled");
 }
 $("#fpbtn").click(function(){
  loadtpage(1);
 });
 $("#rpbtn").click(function(){
  loadtpage(pagenum - 1);
 });
 $("#npbtn").click(function(){
  if ((pagenum + 1) >= pagecount) 
   loadtpage(pagecount);
  else
   loadtpage(pagenum + 1);
 });
 $("#lpbtn").click(function(){
  loadtpage(pagecount);
 });
 $("#gpbtn").click(function(){
  var tzys = $("#gpinput").val();
  var re = /^[1-9]+[0-9]*$/;
  if (tzys == null || tzys == undefined || tzys == '') {
   alert("请输入跳转页数!");
   $("#gpinput").focus();
   return;
  }
  if (!re.test(tzys)) {
   alert("请输入正确跳转页数!");
   $("#gpinput").focus();
   return;
  }
  if (tzys > pagecount) 
   tzys = pagecount;
  if (tzys <= 0) 
   tzys = 1;
  loadtpage(tzys);
 });
 $("#gpinput").val(pagenum);
}

HTML代码:

<table>
 <tfoot>
  <tr>
   <td colspan="11">
    <span class="water-table-listbtn"></span>
    <span class="water-table-page">
     <span id="pagemsg" class="water-table-pagemsg">当前0/0页</span>
     <input type="button" id="fpbtn" value="首页"/>
     <input type="button" id="rpbtn" value="上页"/>
     <input type="button" id="npbtn" value="下页"/>
     <input type="button" id="lpbtn" value="尾页"/>
     <span id="pagemsg" class="water-table-pagemsg">跳转
     <input type="text" id="gpinput" size="3" value="0"/>页
     </span>
     <input type="button" id="gpbtn" value="跳转"/>
    </span>
   </td>
  </tr>
 </tfoot>
</table>

希望本文所述对大家的jquery程序设计有所帮助。

Javascript 相关文章推荐
JavaScript创建命名空间(namespace)的最简实现
Dec 11 Javascript
简短几句 通俗解释javascript的闭包
Jan 17 Javascript
js获取下拉列表的值和元素个数示例
May 07 Javascript
Javascript学习笔记之函数篇(四):arguments 对象
Nov 23 Javascript
微信小程序开发探究
Dec 27 Javascript
jQuery实现的仿百度,仿谷歌搜索下拉框效果示例
Dec 30 Javascript
通过修改360抢票的刷新频率和突破8车次限制实现方法
Jan 04 Javascript
js实现倒计时效果(小于10补零)
Mar 08 Javascript
详解vue.js全局组件和局部组件
Apr 10 Javascript
Vuepress 搭建带评论功能的静态博客的实现
Feb 17 Javascript
修改layui的后台模板的左侧导航栏可以伸缩的方法
Sep 10 Javascript
JavaScript实现随机点名小程序
Oct 29 Javascript
javascript实现禁止鼠标滚轮事件
Jul 24 #Javascript
Css3制作变形与动画效果
Jul 24 #Javascript
四种参数传递的形式——URL,超链接,js,form表单
Jul 24 #Javascript
基于JS实现的倒计时程序实例
Jul 24 #Javascript
可以浮动某个物体的jquery控件用法实例
Jul 24 #Javascript
javascript比较两个日期相差天数的方法
Jul 24 #Javascript
JAVA四种基本排序方法实例总结
Jul 24 #Javascript
You might like
Yii 访问 Gii(脚手架)时出现 403 错误
2018/06/06 PHP
Yii框架中使用PHPExcel的方法分析
2019/07/25 PHP
javascript游戏开发之《三国志曹操传》零部件开发(一)让静态人物动起来
2013/01/23 Javascript
表单验证的完整应用案例探讨
2013/03/29 Javascript
jQuery实现图片信息的浮动显示实例代码
2013/08/28 Javascript
一个JavaScript函数把URL参数解析成Json对象
2014/09/24 Javascript
Node.js中的流(Stream)介绍
2015/03/30 Javascript
JS动态修改表格cellPadding和cellSpacing的方法
2015/03/31 Javascript
jquery+css3实现会动的小圆圈效果
2016/01/27 Javascript
JQuery点击事件回到页面顶部效果的实现代码
2016/05/24 Javascript
JavaScript获取服务器时间的方法详解
2016/12/11 Javascript
js仿网易表单及时验证功能
2017/03/07 Javascript
从零到一详聊创建Vue工程及遇到的常见问题
2019/04/25 Javascript
详解Vue前端生产环境发布配置实战篇
2019/05/07 Javascript
Node.js Windows Binary二进制文件安装方法
2019/05/16 Javascript
如何测量vue应用运行时的性能
2019/06/21 Javascript
微信小程序实现音乐播放页面布局
2020/12/11 Javascript
[07:26]2015国际邀请赛第二日TOP10集锦
2015/08/06 DOTA
[02:42]DOTA2城市挑战赛收官在即 四强之争风起云涌
2018/06/05 DOTA
详解详解Python中writelines()方法的使用
2015/05/25 Python
详解10个可以快速用Python进行数据分析的小技巧
2019/06/24 Python
django2.2安装错误最全的解决方案(小结)
2019/09/24 Python
python matplotlib 画dataframe的时间序列图实例
2019/11/20 Python
pycharm + django跨域无提示的解决方法
2020/12/06 Python
python生成word合同的实例方法
2021/01/12 Python
深入浅析css3 border-image边框图像详解
2015/11/24 HTML / CSS
只要五步 就可以用HTML5/CSS3快速制作便签贴特效(图)
2012/06/04 HTML / CSS
HTML5有哪些新特征
2015/12/01 HTML / CSS
AmazeUI 按钮交互的实现示例
2020/08/24 HTML / CSS
FILA斐乐中国官方商城:意大利运动品牌
2017/01/25 全球购物
婚纱摄影师求职信
2014/03/07 职场文书
年度评优评先方案
2014/06/03 职场文书
装修施工安全责任书
2014/07/24 职场文书
幼儿园六一儿童节主持词
2015/06/30 职场文书
教师学习中国梦心得体会
2016/01/05 职场文书
2019年特色火锅店的创业计划书模板
2019/08/28 职场文书