js css实现的简单易用兼容好的分页

效果

html:复制代码代码如下： div id='page'/div用法：复制代码代码如下： var合计=310;var页码=1；var pageCount=31//共有多少页var page size=10 var action name=' list . action var other param=' name=' www ' order=' time '；$(function(){ paginate()；//分页} );css:复制代码代码如下： # page { font-size : 14pxclear:两者；填充-top : 1.45 em；空白： nowrap} #第a页{ background : white border : 1px固体# E7ECF0display:内联块；高度： 22px线高： 22px右边距： 5px文本对齐：中心；文本装饰：无；垂直对齐： 中间；宽度： 23px} #pagePre，#pageNext{ } .当前页面{ font-weight : bold；} js:复制代码代码如下：函数McGuinate(){ var $ page div=$(' # page ')；actionName=actionName '？页面大小='页面大小if(类型of otherParam！='undefined' otherParam！=' '){操作名=操作名其他参数；} $pageDiv.append('第"页码"页/共"页数"页');//上一页如果(页码1){ var hf=actionName 'pageNo='(页码-1);$ PageDiv。追加(' a href=' HF ' style=' width : 65px；'' '上一页/a ')；};if(页数=page SiZe){ for(var I=0；我页数；I){ var HF=行动名称'页码='(I 1)；如果(页码==(I ^ 1)){//当前页$ PageDiv。追加(' a href=' HF ' ' class=' page current ' ' page no '/a ')；} else { $ PageDiv。追加(' a href=' HF ' '(I 1)'/a ')；};};} else { for(var I=0；我页面大小；I){ var MiDindex=0；if(PageSize % 2==0){ MiDindex=PageSize/2-1；} else { MiDindex=PageSize/2；} var num=-MiDindex；var showPageNum=page no I numif(showPageNum 0 showPageNum=页数){ var HF=动作名称' page no=' showPageNumif(pageNo==showPageNum){//当前页$ PageDiv。追加(' a href=' HF ' ' class=' page current ' ' ShowPageNum '/a ')；} else { $ PageDiv。追加(' a href=' HF ' ' ' showPageNum '/a ')；};};};} //下一页if(页码页数){ var HF=动作名称'页码='(第一页);$ PageDiv。追加(' a href=' HF ' style=' width : 65px；'' '下一页/a ')；};$pageDiv.append('转到' '输入类型=' text ' class=' GoNum ' style=' width :30 px；'名称='goNum '页输入类型='按钮'名称='goButton '类='goButton '值='确定'');$('.go按钮').单击(function(){ var goNum=$(').goNum ').val()；如果(goNum！=' '){ window。位置。href=操作名称'页码=' GoNum} });};