jquery Paging Object Usage Example _jquery

Source: Internet
Author: User
Tags prev

The use method and related parameters are as follows:
displayid//Default value displays the area ID is pagebox, you can not fill
pagesize//per page number, default is 15, you can not fill
totalsize//Total number of articles
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 access 1 here can not fill
Example: Page._run ({totalsize:300,curpage:11,type:1,simple:true}

Copy Code code as follows:



<! DOCTYPE html>


<html>


<head>


<meta charset= "Utf-8"/>


<title>page Objects </title>


<style>


. pagebox,.pagebox1{text-align:center; height:25px padding:15px 0;


. Pagebox. Pages a.up,.pagebox. Pages a.down{color: #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; background: #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; line-height:2px;


</style>


<script type= "Text/javascript" src= ". /jquery/jquery.js "></script><!--jquery supports more than 1.4 versions-->


</head>


<body>


<h1>Page</h1>


<div class= "Pagebox" id= "Pagebox" ></div>


<script type= "Text/javascript" >


var Page = {


/**


displayid//Default value displays the area ID is pagebox, you can not fill


pagesize//per page number, default is 15, you can not fill


totalsize//Total number of articles


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 access 1 here can not fill


Example: Page._run ({totalsize:300,curpage:11,type:1,simple:true}


*/


_run:function (param) {


var totalpages = 1,//Total Pages


Displayid= "#pageBox",//display area ID


Number of pagesize=15,//per page


totalsize=0,//Total number of articles


curpage=1,//Current Page


Url= "",//link address


type=0,//0 default Go HTTP jump, 1 incoming callback function


simple=false;//simple version, no previous page and next page


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);


if (curpage>totalpages) {curpage=totalpages;} The incoming pages are larger than the total number of pages, and the last page counts


if (totalpages>1) {


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


if (curpage!=1) {Pages.push (firstpage);}


if (totalpages>5) {//Total pages exceed 5


for (Var i=1;i<=5;i++) {


if (curpage==i) {


Pages.push (Page._builderpagearea (Type, "", Url,i,i,true,displayid));


}else{


Pages.push (Page._builderpagearea (Type, "", Url,i,i,false,displayid));


}


}


Pages.push (' <span>...</span> ');


Pages.push (Page._builderpagearea (Type, "", Url,totalpages,totalpages,false,displayid));


}else{//the total number of pages <=5, column 1,2,3,4,5


for (Var i=1;i<=totalpages;i++) {


if (curpage==i) {


Pages.push (Page._builderpagearea (Type, "", Url,i,i,true,displayid));


}else{


Pages.push (Page._builderpagearea (Type, "", Url,i,i,false,displayid));


}


}


}


if (curpage!=totalpages) Pages.push (lastpage);


}else if (totalpages-curpage<=4) {//Last page no next page


if (curpage!=1) {Pages.push (firstpage);}


if (totalpages>5) {//Total pages exceed 5


Pages.push (Page._builderpagearea (Type, "", Url,1,1,false,displayid));


Pages.push (' <span>...</span> ');


for (Var i=totalpages-4;i<=totalpages;i++) {


if (curpage==i) {


Pages.push (Page._builderpagearea (Type, "", Url,i,i,true,displayid));


}else{


Pages.push (Page._builderpagearea (Type, "", Url,i,i,false,displayid));


}


}


if (totalpages!=curpage) {Pages.push (lastpage);}


}else{//the total number of pages <=5, column 1,2,3,4,5


for (Var i=1;i<=totalpages;i++) {


if (curpage==i) {


Pages.push (Page._builderpagearea (Type, "", Url,i,i,true,displayid));


}else{


Pages.push (Page._builderpagearea (Type, "", Url,i,i,false,displayid));


}


}


if (curpage!=totalpages) Pages.push (lastpage);


}


}else{//has previous and last pages and the total number of pages must be greater than 5


Pages.push (FirstPage);


Pages.push (Page._builderpagearea (Type, "", Url,1,1,false,displayid));


Pages.push (' <span>...</span> ');


for (Var i=curpage-2;i<=curpage+2;i++) {


if (curpage==i) {


Pages.push (Page._builderpagearea (Type, "", Url,i,i,true,displayid));


}else{


Pages.push (Page._builderpagearea (Type, "", Url,i,i,false,displayid));


}


}


Pages.push (' <span>...</span> ');


Pages.push (Page._builderpagearea (Type, "", Url,totalpages,totalpages,false,displayid));


Pages.push (LastPage);


}


var result = new Array ();


Result.push (' <div class= ' pages ">");


Result.push (Pages.join ('));


Result.push (' </div> ');


$ (Displayid). HTML (Result.join ('));


}


}else{


}





},


/** Calculate total number of pages * *


_gettotalpages:function (_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);


Href.push (' &pagenum= ');


Href.push (page);


}else if (type==1) {


Href.push (' javascript:void (0);p agecallback ("\");


Href.push (page);


Href.push (' \ \ \ \ \ \ ');


Href.push (_displayid);


Href.push (' \ \ ') ');


}


Hrefstr = Href.join ("), Result=new Array ();


if (texttype== ' up ') {


Result.push (' <a href= ");


Result.push (HREFSTR);


Result.push (' "class=" up "> Prev </a> ');


}else if (texttype== ' down ') {


Result.push (' <a href= ");


Result.push (HREFSTR);


Result.push (' "class=" down "> Next page </a>);


}else{


Result.push (' <a href= ");


Result.push (HREFSTR);


if (_focus) {


Result.push (' "style=" background: #6EB4EA; color: #FFF; " > ');


}else{


Result.push (' > ');


}


Result.push (page);


Result.push (' </a> ');


}


Return Result.join (");


}


};


Page._run ({totalsize:100,curpage:1,pagesize:10});


</script>


</body>


</html>


Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.