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 相关文章推荐
jQuery页面滚动浮动层智能定位实例代码
Aug 23 Javascript
nullJavascript中创建对象的五种方法实例
May 07 Javascript
Javascript之this关键字深入解析
Nov 12 Javascript
常见的原始JS选择器使用方法总结
Apr 09 Javascript
JS实现简易图片轮播效果的方法
Mar 25 Javascript
详解如何用webpack打包一个网站应用项目
Jul 12 Javascript
微信小程序自定义toast实现方法详解【附demo源码下载】
Nov 28 Javascript
在layui下对元素进行事件绑定的实例
Sep 06 Javascript
react MPA 多页配置详解
Oct 18 Javascript
javascript事件循环event loop的简单模型解释与应用分析
Mar 14 Javascript
在vue中使用防抖函数组件操作
Jul 26 Javascript
js绘制一条直线并旋转45度
Aug 21 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
常见的PHP五种设计模式小结
2011/03/23 PHP
php中怎么搜索相关联数组键值及获取之
2013/10/17 PHP
php实现将字符串按照指定距离进行分割的方法
2015/03/14 PHP
php实现的mongodb操作类
2015/05/28 PHP
thinkPHP框架通过Redis实现增删改查操作的方法详解
2019/05/13 PHP
doctype后如何获得body.clientHeight的方法
2007/07/11 Javascript
JS解密入门之凭直觉解
2008/06/25 Javascript
js表格分页实现代码
2009/09/18 Javascript
js判断选择的时间是否大于今天的代码
2013/08/20 Javascript
基于jQuery实现的扇形定时器附源码下载
2015/10/20 Javascript
JavaScript多并发问题如何处理
2015/10/28 Javascript
jquery中ajax跨域方法实例分析
2015/12/18 Javascript
关于javascript中限定时间内防止按钮重复点击的思路详解
2016/08/16 Javascript
JavaScript面试题大全(推荐)
2016/09/22 Javascript
详解React Native开源时间日期选择器组件(react-native-datetime)
2017/09/13 Javascript
jQuery利用FormData上传文件实现批量上传
2018/12/04 jQuery
微信小程序新手教程之页面打开数量限制
2019/03/03 Javascript
vue项目使用高德地图的定位及关键字搜索功能的实例代码(踩坑经验)
2020/03/07 Javascript
TypeScript魔法堂之枚举的超实用手册
2020/10/29 Javascript
python使用xauth方式登录饭否网然后发消息
2014/04/11 Python
Python列表(list)、字典(dict)、字符串(string)基本操作小结
2014/11/28 Python
Python中使用插入排序算法的简单分析与代码示例
2016/05/04 Python
详解python中@的用法
2019/03/27 Python
详解Python 4.0 预计推出的新功能
2019/07/26 Python
django项目用higcharts统计最近七天文章点击量
2019/08/17 Python
python标准库OS模块详解
2020/03/10 Python
Python DES加密实现原理及实例解析
2020/07/17 Python
西班牙国家航空官方网站:Iberia
2017/11/16 全球购物
全球最大的在线旅游公司:Expedia
2017/11/16 全球购物
康帕斯酒店预订:Compass Hospitality(支持中文)
2018/08/23 全球购物
收款委托书
2014/10/14 职场文书
2014年小学教导处工作总结
2014/12/19 职场文书
中考百日冲刺决心书
2015/09/22 职场文书
2019各种承诺书范文
2019/06/24 职场文书
你有一份《诚信考试承诺书》待领取
2019/11/13 职场文书
python图像处理基本操作总结(PIL库、Matplotlib及Numpy)
2021/06/08 Python