CopyCode The Code is as follows: <! Doctype HTML public "-// W3C // dtd xhtml 1.0 transitional // en" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<HTML xmlns = "http://www.w3.org/1999/xhtml">
<Head>
<Title> jquery paging Control </title>
<SCRIPT src = "jquery-1.3.min.js" type = "text/JavaScript"> </SCRIPT>
</Head>
<Body>
<Div class = "pager"> </div>
<! -- <Div>
<Select class = "Seid">
<Option> 10 </option>
<Option selected = "selected"> 20 </option>
<Option> 30 </option>
</SELECT>
<Div class = "first"> homepage </div>
<Div class = "pre"> previous page </div>
<Div class = "centerclass"> </div>
<Div class = "Next"> next page </div>
<Div class = "last"> last page </div>
<Input type = "text" value = "1"/> of <SPAN class = "totelspan"> 0 </span>
</Div> -->
</Body>
</Html>
<SCRIPT type = "text/JavaScript">
VaR pageindex = 1;
VaR totelsize = 60;
VaR centersize = 5;
VaR pagesize = 0;
VaR totelsec = 0;
VaR outstr = "";
VaR Se = "<select class = \" Seid \ ">"
+ "<Option> 5 </option>"
+ "<Option selected = \" selected \ "> 10 </option>"
+ "<Option> 15 </option>"
+ "</SELECT> ";
VaR firstdiv = "<Div class = \" first \ "> homepage </div> ";
VaR prediv = "<Div class = \" pre \ "> previous page </div> ";
VaR centerdiv = "<Div class = \" centerclass \ "> </div> ";
VaR nextdiv = "<Div class = \" next \ "> next page </div> ";
VaR lastdiv = "<Div class = \" Last \ "> last page </div> ";
$ ('. Pager'). Empty ();
$ ('. Pager'). append (SE)
$ ('. Pager'). append (firstdiv)
$ ('. Pager'). append (prediv)
$ ('. Pager'). append (centerdiv)
$ ('. Pager'). append (nextdiv)
$ ('. Pager'). append (lastdiv)
Function pageinit ()
{
VaR size = 0;
VaR barobj = this;
VaR pagereinit = function ()
{
Pagesize = $ (". Seid option: Selected") [0]. innertext;
Size = parseint (totelsize/pagesize)
VaR lastsize = totelsize % pagesize; // records displayed on the last page
If (lastsize> 0)
{
Size = size + 1;
}
Totelsec = parseint (size/centersize );
VaR leftsize = size % centersize; // display record of the last segment
If (leftsize> 0)
{
Totelsec = totelsec + 1;
}
Pagebarinit ();
}
VaR resetpage = function ()
{
Pageindex = 1;
Pagesize = 0;
Totelsec = 0;
Outstr = "";
}
// Alert ('total page number: '+ size)
// Alert ('total region: '+ totelsec)
// Alert ('number of records per page: '+ pagesize );
VaR seclick = function (E)
{
VaR selectindexpaie.targetpolice.tar get. selectedindex]. innertext;
Pagesize = parseint (selectindex );
Alert ('per page: '+ selectindex );
Resetpage ();
Pagereinit ();
}
VaR firstclick = function (E)
{
Alert ('click to homepage ');
If (pageindex! = 1)
{
Pageindex = 1;
Alert ('page 1st ');
}
}
VaR preclick = function (E)
{
Alert ('click to previous page ');
If (pageindex! = 1)
{
Pageindex = pageindex-1;
Alert ('to' + pageindex + '');
}
Changecenterbar (pageindex + 1 );
}
VaR pageclick = function (E)
{
VaR targepage1_parseint(e.tar get. innertext );
Pageindex = targepage;
Alert ('click '+ targepage + "page ");
Changecenterbar (targepage );
}
VaR nextclick = function (E)
{
Alert ('click next page ');
If (pageindex <size)
{
Pageindex = pageindex + 1;
If (pageindex = size)
{
Alert ('till the last page ');
}
Else {
Alert ('to' + pageindex + '');
}
}
Changecenterbar (pageindex-1 );
}
VaR lastclick = function (E)
{
Alert ('click the last page ');
If (pageindex <size)
{
Pageindex = size;
Alert ('to the '+ size + 'page ');
}
}
VaR changecenterbar = function (currentindex)
{
VaR currentsec = parseint (currentindex/centersize );
If (currentindex % centersize = 1)
{
If (currentsec <totelsec)
{Pagebarinit ();}
}
If (currentindex % centersize = 0)
{
VaR currentsec = parseint (currentindex/centersize );
If (currentsec <totelsec)
{Pagebarinit ();}
}
}
VaR pagebarinit = function ()
{
$ ('. Seid'). Unbind ('change', seclick );
$ ('. First'). Unbind ('click', firstclick );
$ ('. Pre'). Unbind ('click', preclick );
$ ('. Next'). Unbind ('click', nextclick );
$ ('. Last'). Unbind ('click', lastclick );
$ ('. Seid'). BIND ('change', seclick );
$ ('. First'). BIND ('click', firstclick );
$ ('. Pre'). BIND ('click', preclick );
$ ('. Next'). BIND ('click', nextclick );
$ ('. Lala'). BIND ('click', lastclick );
If (size <= centersize)
{
$ ('. Centerclass'). Empty ();
For (VAR I = 1; I <= size; I ++)
{
VaR cdiv = "<span id = 'page _" + String (I) + "'>" + I + "</span> ";
$ ('. Centerclass'). append (cdiv );
$ ("# Page _" + I). BIND ('click', pageclick );
}
} Else if (size> centersize)
{
$ ('. Centerclass'). Empty ();
If (pageindex % centersize = 0)
{
VaR currentsec = parseint (pageindex/centersize); // current section
If (currentsec <totelsec)
{
// Alert (9)
VaR startindex = (currentSec-1) * centersize + 1;
For (startindex; startindex <= currentsec * centersize; startindex ++)
{
// Alert (startindex)
// Alert ('Max' + currentsec * centersize );
VaR cdiv = "<span id = 'page _" + String (startindex) + "'>" + startindex + "</span> ";
$ ('. Centerclass'). append (cdiv );
$ ("# Page _" + startindex). BIND ('click', pageclick );
}
}
Else if (currentsec = totelsec)
{
VaR startindex = (currentSec-1) * centersize + 1;
For (startindex; startindex <= currentsec * centersize; startindex ++)
{
VaR cdiv = "<span id = 'page _" + String (startindex) + "'>" + startindex + "</span> ";
$ ('. Centerclass'). append (cdiv );
$ ("# Page _" + startindex). BIND ('click', pageclick );
}
} Else {
Alert ('paging error ');
}
} Else if (pageindex % centersize> 0)
{
VaR currentsec = parseint (pageindex/centersize) + 1; // current section
If (currentsec <totelsec)
{
VaR startindex = (currentSec-1) * centersize + 1;
For (startindex; startindex <= (currentSec-1) * centersize + centersize); startindex ++)
{
VaR cdiv = "<span id = 'page _" + String (startindex) + "'>" + startindex + "</span> ";
$ ('. Centerclass'). append (cdiv );
$ ("# Page _" + startindex). BIND ('click', pageclick );
}
}
Else if (currentsec = totelsec ){
VaR startindex = (currentSec-1) * centersize + 1;
For (startindex; startindex <= (currentSec-1) * centersize + size % centersize); startindex ++)
{
VaR cdiv = "<span id = 'page _" + String (startindex) + "'>" + startindex + "</span> ";
$ ('. Centerclass'). append (cdiv );
$ ("# Page _" + startindex). BIND ('click', pageclick );
}
} Else
{
Alert ('paging error ');
}
}
}
}
Pagereinit ();
}
Pageinit ();
</SCRIPT>
