<span style= "FONT-FAMILY:KAITI_GB2312;FONT-SIZE:18PX;" >1, paging/** paging */var size = Data.count; Total pages var spage = (page-1) < 1? 1: (page-1); var pagehtml = "<a href=\" #\ "onclick=\" javascript:getbooklist ("+ spage +"); \ "><span><< /span></a> "; var firstpage =" 0.5 "; var endpage = 10;//used to hide part of a for (var p = page;p>0;p--) {firstpage = p/5+) When there are too many pages "; if (Firstpage.indexof (". ") = =-1) {firstpage = p+ ""; endpage = FirstPage + 10;break;}} if (Firstpage.indexof (".")! =-1) {firstpage = 1;endpage = 10;} if (EndPage > Size) {endpage = size;} for (var j = firstpage; J <= EndPage; + j) {var cl = ""; if (page = = j) {cl = "Now";} pagehtml + = "<span><a href=\" #\ "class=\" "+ cl +" \ "onclick=\" Javascript:startbook ("+ j +") \ ">" + j + "< /a></span> ";} pagehtml + = "Total" + size + "page goto <input type=\" text\ "size=\" 3\ "id=\" topage\ "/> Page";p agehtml + = "<a class=\" btn\ "hr Ef=\ "#\" onclick=\ "startbook (0) \" ><span> Jump </span></a> "; $ (" #pageHTML "). HTML (pagehtml), Function Startbook (page) {if (K17.isempty (page) | | page = = 0)//paging jump using page = $ (" #toPage "). Val ();// Encapsulation conditions, encapsulation calls an AJAX request function}2.tab Toggles the tab effect of the two toggle styles implemented <div class= "Link1" ><a class= "M Now" href= "#" onclick= " Javascript:startbook (this,1,1); "id=" 1 "> Boys </a><a class=" W "href=" # "onclick=" Javascript:startbook (this "Id=" 2 "> Schoolgirl </a></div><div class=" link2 "><a class=" M "href=" # "onclick=" javascript: StartBook1 (this,1,1); "id=" 1 ">tab1 </a><a class=" W "href=" # "onclick=" Javascript:startbook1 (this,1,2); " Id= "2" >tab2 </a><a class= "W" href= "#" onclick= "Javascript:startbook1 (this,1,3);" id= "3" >tab3 </a ></div>/*** The current tab new style */function Startbook (obj,page,zone) {$ (". Link1 a"). Removeclass ("Now"); $ (obj). AddClass ("Now"), var zone = $ (". Link1. Now"). attr ("id"); alert (zone); /*** Change Style */function StartBook1 (obj,page,zone) {$ (". Link2 a"). Removeclass ("M"). AddClass ("W"); $ (obj). Removeclass ("W" ). AddClass ("M"); var zone = $ (". Link2. M "). attr (" id "); alert (zone);} </span>
Reprint indicates: Http://blog.csdn.net/yangkai_hudong
JS implementation simple Baidu Paging and two tab style switch simple implementation