jquery分页控件

var pageindex=1;

var totelsize=60;

var centersize=5;

var pagesize=0;

var totelSec=0;

var outStr="";

var se=""

+"5"

+"10"

+"15"

+"";

var firstdiv="

首页

";

var prediv="

上一页

";

var centerdiv="

var nextdiv="

下一页

";

var lastdiv="

最后一页

";

$('.pager').empty();

$('.pager').append(se)

$('.pager').append(firstdiv)

$('.pager').append(prediv)

$('.pager').append(centerdiv)

$('.pager').append(nextdiv)

$('.pager').append(lastdiv)

function PageInit()

{

var size=0;

var barObj=this;

var PageReinit=function()

{

pagesize=$(".SEID option:selected")[0].innerText;

size=parseInt(totelsize/pagesize)

var lastSize=totelsize%pagesize;//最后一页显示记录

if(lastSize>0)

{

size=size+1;

}

totelSec=parseInt(size/centersize);

var leftSize=size%centersize;//最后一个区段的显示记录

if(leftSize>0)

{

totelSec =totelSec+1;

}

PageBarinit();

}

var reSetPage=function()

{

pageindex=1;

pagesize=0;

totelSec=0;

outStr="";

}

// alert('总页数:'+size)

// alert('总区段:'+totelSec)

// alert('每页记录数:'+pagesize);

var SeClick=function(e)

{

var Selectindex=e.target[e.target.selectedIndex].innerText;

pagesize=parseInt(Selectindex);

alert('每页显示:'+Selectindex);

reSetPage();

PageReinit();

}

var firstClick=function(e)

{

alert('点击到首页');

if(pageindex!=1)

{

pageindex=1;

alert('到了第1页');

}

}

var preClick=function(e)

{

alert('点击到上一页');

if(pageindex!=1)

{

pageindex =pageindex-1;

alert('到了第'+pageindex+'页');

}

ChangeCenterBar(pageindex+1);

}

var pageClick=function(e)

{

var targePage=parseInt(e.target.innerText);

pageindex=targePage;

alert('点击了第'+targePage+"页");

ChangeCenterBar(targePage);

}

var nextClick=function(e)

{

alert('点击了下一页');

if(pageindex

{

pageindex =pageindex+1;

if(pageindex==size)

{

alert('到了最后一页');

}

else{

alert('到了第'+pageindex+'页');

}

}

ChangeCenterBar(pageindex-1);

}

var lastClick=function(e)

{

alert('点击了最后一页');

if(pageindex

{

pageindex=size;

alert('到了第'+size+'页');

}

}

var ChangeCenterBar=function(CurrentIndex)

{

var currentSec=parseInt(CurrentIndex/centersize);

if( CurrentIndex%centersize==1)

{

if(currentSec

{ PageBarinit();}

}

if(CurrentIndex%centersize==0)

{

var currentSec=parseInt(CurrentIndex/centersize);

if(currentSec

{ PageBarinit();}

}

}

var PageBarinit=function()

{

$('.SEID').unbind('change',SeClick);

$('.first').unbind('click',firstClick);

$('.pre').unbind('click',preClick);

$('.next').unbind('click',nextClick);

$('.last').unbind('click',lastClick);

$('.SEID').bind('change',SeClick);

$('.first').bind('click',firstClick);

$('.pre').bind('click',preClick);

$('.next').bind('click',nextClick);

$('.last').bind('click',lastClick);

if(size<=centersize)

{

$('.centerclass').empty();

for(var i=1;i<=size;i++)

{

var cdiv=""+i+"";

$('.centerclass').append(cdiv);

$("#Page_"+i).bind('click',pageClick);

}

}else if(size>centersize)

{

$('.centerclass').empty();

if( pageindex%centersize==0)

{

var currentSec=parseInt(pageindex/centersize);//当前区段

if(currentSec

{

// alert(9)

var startIndex=(currentSec-1)*centersize+1;

for(startIndex;startIndex<=currentSec*centersize;startIndex++)

{

//alert(startIndex)

//alert('最大'+currentSec*centersize);

var cdiv=""+startIndex+"";

$('.centerclass').append(cdiv);

$("#Page_"+startIndex).bind('click',pageClick);

}

}

else if(currentSec==totelSec)

{

var startIndex=(currentSec-1)*centersize+1;

for(startIndex;startIndex<=currentSec*centersize;startIndex++)

{

var cdiv=""+startIndex+"";

$('.centerclass').append(cdiv);

$("#Page_"+startIndex).bind('click',pageClick);

}

}else{

alert('分页出错');

}

}else if(pageindex%centersize>0)

{

var currentSec=parseInt(pageindex/centersize)+1;//当前区段

if(currentSec

{

var startIndex=(currentSec-1)*centersize+1;

for(startIndex;startIndex<=((currentSec-1)*centersize+centersize);startIndex++)

{

var cdiv=""+startIndex+"";

$('.centerclass').append(cdiv);

$("#Page_"+startIndex).bind('click',pageClick);

}

}

else if(currentSec==totelSec){

var startIndex=(currentSec-1)*centersize+1;

for(startIndex;startIndex<=((currentSec-1)*centersize +size%centersize);startIndex++)

{

var cdiv=""+startIndex+"";

$('.centerclass').append(cdiv);

$("#Page_"+startIndex).bind('click',pageClick);

}

}else

{

alert('分页出错');

}

}

}

}

PageReinit();

}

PageInit();

jq实现html分页代码,jquery 分页控件实现代码相关推荐

  1. 日历控件的android代码,Android日历控件PickTime代码实例

    Android日历控件PickTime代码实例 发布时间:2020-10-03 16:05:51 来源:脚本之家 阅读:86 作者:手撕高达的村长 最近做项目,需要设置用户的生日,所以做这样一个功能. ...

  2. 206_QT_功能实现代码、界面控件操作代码分开实现,很不错【采用了Q_CLASSINFO、Q_PROPERTY、setProperty对控件设置属性、qobject_cast】

    动图: setProperty对控件设置属性,用于判断是哪一个控件,很巧妙 使用qobject_cast,对类指针进行下行转换,也很不错 qperson.h–年龄增加功能实现 #ifndef QPER ...

  3. 非存储过程分页- 前台分页样式和控件

    非存储过程分页- 前台分页样式和控件 一.   DAL /// ///分页sql /// public DataTable GetUserAndError(int pageSize, int page ...

  4. 服务器lIS绑定网站,DataList 中动态绑定服务器子控件的代码

    DataList 中动态绑定服务器子控件的代码 更新时间:2007年09月10日 21:54:04   作者: 1.首先绑定dbList (一个DataList控件名称) 2.设置绑定子控件需要的关键 ...

  5. Jquery获得控件值的方法

    一 Jquery获得服务器控件值的方法 由于ASP.NET网页运行后,服务器控件会随机生成客户端id,jquery获取时候不太好操作,google了下,总结有以下3种方法: 服务器控件代码:<a ...

  6. 精确到秒的JQuery日期控件,jquery日历插件,jquery日期插件

    2019独角兽企业重金招聘Python工程师标准>>> 效果图如下: 首先在页面中引用一下库: <link type="text/css" href=&qu ...

  7. ASP.NET重用代码技术 - 用户控件技术

    作者: 苏红超 使用ASP.NET中的代码绑定技术来使得代码重用变得简单可行.我们发现,利用代码绑定技术我们可以容易的将我们的代码和内容分离开来,利用它可以建立可重用的代码,只是这种技术本身也存在着一 ...

  8. 控件包含代码块,因此无法修改控件集合

    文章转载至:  http://www.olnote.com/itlife/note/100000003.aspx 控件包含代码块(即<% ... %>),因此无法修改控件集合. 说明: 执 ...

  9. 控件包含代码块(即 % ... %),因此无法修改控件集合。

    第一种: 在使用主题的时候出现 控件包含代码块(即 <% ... %>),因此无法修改控件集合错误,原来错误的原因是: 控件包含代码块(即 <% ... %>),因此无法修改控 ...

  10. Jquery 日历控件

    非常好的Jquery日历控件 http://keith-wood.name/datepick.html 转载于:https://www.cnblogs.com/hubj/archive/2011/04 ...

最新文章

  1. 【CSDN2012年度博客之星】需要您的一票,感谢大家的支持
  2. 导入外部项目无法识别为Web项目无法部署到tomcat
  3. 本地安全沙箱最快解决办法
  4. Android Canvas画图形(更新中)
  5. 一条SQL语句执行得很慢的原因有哪些?
  6. P5737 【深基7.例3】闰年展示(python3实现)
  7. 没想到,这么简单的线程池用法,深藏这么多坑
  8. vsc中HTML配置,vscode怎么配置node?
  9. Poj 1936,3302 Subsequence(LCS)
  10. 【语音识别】基于matlab MFCC+IPC特征+SVM中英语种识别【含Matlab源码 612期】
  11. 安徽省湖泊河流ArcGIS地形图shp图层文件下载
  12. 如何设计 RQData 通讯协议 - Ricequant米筐量化
  13. Java中的frontcolor_front的用法总结大全
  14. 蒸汽流量计算软件_网上难得学到的知识!涡街流量计选型设计有诀窍
  15. 华为交换机如何恢复出厂设置
  16. 漫画趣解Linux内核
  17. 1. 拼多多什么软件可以看到大数据?拼多多大数据分析软件有哪些?
  18. Elasticsearch - JNA
  19. AAAI 2020 提前看 | 三篇论文解读问答系统最新研究进展
  20. 马尔科夫不等式和坎泰利不等式的证明

热门文章

  1. 51单片机学习之DS18B20温度传感器
  2. #蓝桥杯嵌入式#第七届预赛:液位检测告警系统
  3. 2019-8-6-在-Gitlab-开启-MatterMost-机器人
  4. 公司HR很专业,为何还要进行人力资源服务外包?
  5. 深度学习硬件架构简述
  6. 大数据 -- java基础8 接口特点和用法
  7. 城市连动纯js代码DEMO
  8. python输出值报错_python:内建函数(一)数值相关、编码转换、help等
  9. 西电软工计算机通信与网络期末复习要点总结
  10. linux yum常用命令