This article mainly introduces the jquery pagination Object Usage example, the need friend can refer to the following
Use methods and related parameters as follows: displayid//default value display Area ID is pagebox, can not fill pagesize//per page number, default is 15, you can not fill totalsize//Total number curpage//Current page simple//default is false,true no previous page and next page, type//0 default Go http jump, 1 is JSP page must have Pagecallback (pagenum) function, Starting from 1 url//link address, if type is out of 1 here you can not fill in Example: Page._run ({totalsize:300,curpage:11,type:1,simple:true} Code as follows: <! DOCTYPE html> <html> <head> <meta charset= "Utf-8"/> <title>page object </title> <style > pagebox,.pagebox1{text-align:center height:25px padding:15px 0. Pagebox. Pages a.up,.pagebox. Pages a.down{Co Lor: #6eb4ea; Text-decoration:none; border:1px solid #ffffff; Background:none;} . Pagebox. pages a.else{background:none; border:none; pagebox. Pages a{padding:3px 7px border:1px solid #f3f6f6 backg Round: #fdfdfd; margin:0 5px; Color: #999999;} . Pagebox. Pages a:hover,.pagebox. Pages a.hover{background: #6eb4ea; border:1px solid #6eb4ea; color: #ffffff; TEXT-DECORATION:NONE;PADDING:2PX 7px; } pagebox. PAges span{padding:3px 7px; color: #999999; fiv_sep{height:3px; float:left; width:100%; font-size:4px ;} </style> <script type= "Text/javascript" src= ". /jquery/jquery.js "></script><!--jquery support more than 1.4 version--> </head> <body> <h1>page</ h1> <div class= "Pagebox" id= "Pagebox" ></div> <script type= "Text/javascript" > var Page = { &NB Sp /** displayid//default display area ID is pagebox, you can not fill the pagesize//per page number, Default is 15, can not fill totalsize//total number of CURPA ge//Current page simple//default is false,true no previous page and next page, type//0 default go http jump, 1 is the JSP page must have Pagecallback (pagenum) function, starting from 1 url//link address, if type access 1 here can not fill the Example: Page._run ({totalsize:300,curpage:11,type:1,simple:true} / _RUN:FUNction (param) { var totalpages = 1,//Total pages displayid= "# Pagebox ",//Show area ID pagesize=15,//per page number &N Bsp totalsize=0,//Total number curpage=1,//current page &nbs P url= "",//link address Typ e=0,//0 default Go HTTP jump, 1 incoming callback function simple=false;//simple version, no previous page and next page &NB Sp if (param.type!=undefined) Type=param.type; if (param.displayid!=undefined) Displayid=param.displayid; if (param.pagesize!=undefined) pagesize=param.pagesize; if (param.totalsize!=undefined) totalsize=param.totalsize; if (param.curpage!=undefined) Curpage=param.curpage; if (param.url!=undefined) url=param.url; if (param.simple!= undefined) simple=param.simple; if (Url.indexof ("?") ==-1) { URL = "1=1"; } if (totalsize>0) { totalpages = Page._gettotalpages (totalsize,pagesize); nbsp if (curpage>totalpages) {curpage=totalpages} Incoming pages are larger than the total number of pages, on the last page count if (totalpages>1) { &NBS P var firstpage= simple "" ":P Age._builderpagearea (Type, "Up", Url,curpage-1, "prev", False,displayid), LastPage = simple? "":P Age._builderpagearea (type, down, Url,parseint (curpage) +1, next page, False,displaYid), pages = new Array (); if (curpage<=4) {//First page no previous page &N Bsp if (curpage!=1) {Pages.push (firstpage);} if (totalpages>5) {//Total pages more than 5 & nbsp for (Var i=1;i<=5;i++) { &NBSP ; if (curpage==i) { & nbsp Pages.push (Page._builderpagearea (Type, "", Url,i,i,true,displayid)); &NBS P }else{ &NB Sp Pages.push (Page._builderpagearea (Type, "", Url,i,i,false,displayid)); } & nbsp & nbsp Pages.push (' <span>...</span> '); Pages.push (Page._builderpagearea type, "", Url,totalpages,totalpages,false,displayid)); &NB Sp }else{//Total pages <=5, columns 1,2,3,4,5 F or (Var i=1;i<=totalpages;i++) { &NBS P if (curpage==i) { &NBsp Pages.push (page._builder Pagearea (Type, "", Url,i,i,true,displayid)); }else{ &NB Sp Pages.push (page._builderpageare A (Type, "", Url,i,i,false,displayid)); } & nbsp &NB Sp if (curpage!=totalpages) Pages.push (lastpage); &NBSP }else if (totalpages-curpage<=4) {//Last page no next page if (curpage!=1) {Pages.push (firstpage);} &NBSP ; if (totalpages>5) {//Total pages exceeding 5 &N Bsp Pages.push (Page._builderpagearea (Type, "", Url,1,1,false,displayid)); Pages.push (' <SPAN>...</SPAN&G t; '); for (Var i=totalpages-4;i<=totalpage s;i++) { if (curpage==i) { Pages.push (Page._builderpagearea (type, "", Url,i,i,true,displayid)); }else{ &NB Sp Pages.push (page._builderpageare A (Type, "", Url,i,i,false,displayid)); } & nbsp & nbsp if (totalpages!=curpage) {Pages.push (lastpage);} &NBS P }else{//total pages <=5, columns 1,2,3,4,5 & nbsp for (Var i=1;i<=totalpages;i++) { &NB Sp IF (curpage==i) { &N Bsp Pages.push (Page._builderpagearea (Type, "", Url,i,i,true,displayid)); }else{ &NB Sp Pages.push (page._builderpageare A (Type, "", Url,i,i,false,displayid)); } & nbsp &NB Sp { & nbsp if (curpage!=totalpages) Pages.pu SH (lastpage); &nbSp { & nbsp }else{//has previous page and last page and total pages must be greater than 5 &NB Sp Pages.push (firstpage); &N Bsp Pages.push (Page._builderpagearea (Type, "", Url,1,1,false,displayid)); Pages.push (' <span>...</span> '); for (Var i=curpage-2;i<=curpage+2;i++) { &NB Sp if (curpage==i) { & nbsp Pages.push Page._builderpagearea (Type, "", Url,i,i,true, Displayid));   }else{ &NB Sp Pages.push (Page._builderpagearea (Type, "", Url,i,i,false,displayid)); } & nbsp { & nbsp Pages.push (' <span>...</span> '); Pages.push Page._builderpagearea (Type, "", URL, Totalpages,totalpages,false,displayid)); Pages.push (lastpage); var resu lt = new Array (); Result.push (' <div class= ' pages ' > '); Result.push (Pages.join (")); Result.push (' </div> '); $ (Displayid). HTML (Result.join (')); }else{ & nbsp } }, /** calculation total pages/ _gettotalpages:functio N (_totalsize,_pagesize) { if (_totalsize%_pagesize==0) return _totalsize/_pagesize; else return parseint (_totalsize/_pagesize) +1; }, /** each page area of the construction pagination * * _builderpagearea:function (Type,texttype,url,page,text,_focus,_displayid) { var hrefstr,href= new Array (); if (type==0) { href.push (URL); &N Bsp Href.push (' &pagenum= '); Href.push (page); }else if (type==1) { Href.push (' javascript:void (0);p AG Ecallback ("); Href.push p Age); Href.push (', '); Href.push (_displayid); Href.push (') '); } HREFSTR = Href.join ('), result=new Array (); if (texttype== ' up ') { &NBSP; Result.push (' <a href= '); Result.push (HREFSTR); Result.push (' "class=" up "> Last page </a>); }else if (texttype== ' down ') { &NB Sp Result.push (' <a href= '); Result.push (HREFSTR); Result.push (' "class=" down "> Next page </a>); }else{ Result.push (' <a href= ") &n Bsp Result.push (HREFSTR); if (_focus) { &NBSP ; Result.push (' style= ' background: #6EB4EA; color: #FFF; " > '); }else{ &NB Sp Result.push (' > '); RESULT.P Ush (page); Result.push (' </a> '); } return Result.join ('); } }; Page._run ({totalsize:100,curpage:1,pagesize:10}); </script> </body> </html> Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
