Originally wanted to use the internet to find the paging program, but have to make changes, feel trouble, or write yourself a good, after their own time to modify the convenience ~ ~ Everyone more hands, write their own is the best, what to do in the future, make changes is also very easy ~ ~ by the way also expand your own code base ~ ~
Add, Cpage is a page count, should be a global variable, so you can call it anywhere, Totalpage is the total number of pages
<!doctype HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "http://www.w3.org/TR/xhtml1/DTD/ Xhtml1-transitional.dtd "> <ptml xmlns=" http://www.w3.org/1999/xhtml "lang=" gb2312 "> <pead> <title >js Static Paging program </title> </pead> <style type= "Text/css" > A:link,a:visited,a:hover,.current, #info {bo rder:1px solid #DDD; Background: #F2F2F2; Display:inline-block; margin:1px; Text-decoration:none; font-size:12px; width:15px; height:15px; Text-align:center; line-height:15px; Color: #AAA; PADDING:1PX 2px; a:hover{border:1px solid #E5E5E5; Background: #F9F9F9; }. current{border:1px solid #83E7E4; Background: #DFF9F8; margin:1px; Color: #27CBC7; } #info {Width:auto; } </style> <body> <div id= "setpage" ></div> <script type= "Text/javascript" > <!--var TOTALPAGE,PAGESIZE,CPAGE,COUNT,CURCOUNT,OUTSTR; Initialize cpage = 1; Totalpage = 56; pagesize = 10; outstr = ""; function GoToPage (target) {cpage = target; Position the page count to the first page setpage (); Reloadpage (target); Call the Display page function to display the first few pages, this function is used in the page content with Ajax load situation} function Setpage () {if (totalpage<=10) {//Total pages less than 10 pages for ( count=1;count<=totalpage;count++) {if (count!=cpage) {outstr = outstr + "" +c Ount+ ""; }else{outstr = outstr + "<span class= ' current ' >" +count+ "</span>"; totalpage>10 {//The total number of pages is greater than 10 pages if (parseint (cpage-1)/10) = 0) { for (count=1;count<=10;count++) {if (count!=cpage) { outstr = outstr + "" +count+ ""; }else{outstr = outstr + "<span class= ' current ' >" +count+ "</span>"; }} outstr = Outstr+ "Next"; else if (parseint (cpage-1)/10 = = parseint (TOTALPAGE/10)) {outstr = outstr + "Previo US "; For (Count=parseint (TOTALPAGE/10) *10+1;count<=totalpage;count++) {if (count!=cpage) { outstr = outstr + "" +count+ ""; }else{outstr = outstr + "<span class= ' current ' >" +count+ "</span>"; }} else {outstr = outstr + "Previous"; For (Count=parseint (cpage-1)/10) *10+1;count<=parseint ((cpage-1)/10) *10+10;count++) { if (count!=cpage) {outstr = outstr + "" +count+ ""; }else{outstr = outstr + "<span class= ' current ' >" +count+ "</span>"; } outstr = Outstr + "Next"; } } document.getElementById ("Setpage"). InnerHTML = "<div id= ' setpage ' ><span ' the id= ' info ' > co ' +totalpage + "page |" +cpage+ "page <\/span>" + outstr + "<\/div>"; outstr = ""; } setpage (); Call Paging//--> </script> </body> </ptml>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]