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级联下拉列表实例代码(自写)
May 10 Javascript
js和jquery中循环的退出和继续学习记录
Sep 06 Javascript
使用jquery清空、复位整个输入域
Apr 02 Javascript
jQuery插件jRumble实现网页元素抖动
Jun 05 Javascript
jQuery easyUI datagrid 增加求和统计行的实现代码
Jun 01 Javascript
JS实现的RGB网页颜色在线取色器完整实例
Dec 21 Javascript
Vue实例简单方法介绍
Jan 20 Javascript
微信小程序 wx.login解密出现乱码的问题解决办法
Mar 10 Javascript
总结4个方面优化Vue项目
Feb 11 Javascript
微信小程序学习笔记之表单提交与PHP后台数据交互处理图文详解
Mar 28 Javascript
Vue项目history模式下微信分享爬坑总结
Mar 29 Javascript
详解Vue中组件的缓存
Apr 20 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 cli 方式 在crotab中运行解决
2010/02/08 PHP
一个PHP的String类代码
2010/04/20 PHP
浅谈php中fopen不能创建中文文件名文件的问题
2017/02/06 PHP
thinkphp框架类库扩展操作示例
2019/11/26 PHP
jquery last-child 列表最后一项的样式
2010/01/22 Javascript
基于jQuery的js分页代码
2010/06/10 Javascript
基于jquery的web页面日期格式化插件
2011/11/15 Javascript
jquery click([data],fn)使用方法实例介绍
2013/07/08 Javascript
jQuery中html()方法用法实例
2014/12/25 Javascript
使用jQuery管理选择结果
2015/01/20 Javascript
JavaScript实现将文本框的值插入指定位置的方法
2015/08/13 Javascript
全面解析Bootstrap中tab(选项卡)的使用方法
2016/06/06 Javascript
ECMAScript6变量的解构赋值实例详解
2017/09/19 Javascript
详解组件库的webpack构建速度优化
2018/06/18 Javascript
AngularJS实现与后台服务器进行交互的示例讲解
2018/08/13 Javascript
Vue实现星级评价效果实例详解
2019/12/30 Javascript
JS实现手写 forEach算法示例
2020/04/29 Javascript
[07:57]DOTA2热力大趴狂欢夜 广州站活动回顾
2013/11/27 DOTA
[57:22]2018DOTA2亚洲邀请赛 4.7总决赛 LGD vs Mineski 第五场
2018/04/10 DOTA
[45:59]完美世界DOTA2联赛PWL S2 FTD vs GXR 第二场 11.22
2020/11/24 DOTA
python 异常处理总结
2016/10/18 Python
代码讲解Python对Windows服务进行监控
2018/02/11 Python
关于Python正则表达式 findall函数问题详解
2018/03/22 Python
Pytorch Tensor的索引与切片例子
2019/08/18 Python
python爬虫 urllib模块url编码处理详解
2019/08/20 Python
如何解决django-celery启动后迅速关闭
2019/10/16 Python
解决python replace函数替换无效问题
2020/01/18 Python
html5服务器推送_动力节点Java学院整理
2017/07/12 HTML / CSS
html5指南-2.如何操作document metadata
2013/01/07 HTML / CSS
荷兰在线钓鱼商店:Raven
2019/06/26 全球购物
创业计划书的写作技巧及要点
2014/01/31 职场文书
建筑工地宣传标语
2014/06/18 职场文书
《兰兰过桥》教学反思
2016/02/20 职场文书
高二英语教学反思
2016/03/03 职场文书
2016年八一建军节活动总结
2016/04/05 职场文书
python绘图subplots函数使用模板的示例代码
2021/04/30 Python