Copy codeThe 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>
<Meta http-equiv = "Content-Type" content = "text/html; charset = gb2312"/>
<Meta http-equiv = "Content-Language" content = "zh-CN"/>
<Meta content = "all" name = "robots"/>
<Meta name = "Copyright" content = ""/>
<Meta name = "description" content = ""/>
<Meta content = "" name = "keywords"/>
<Link rel = "stylesheet" type = "text/css" href = "css.css"/>
<Title> original region management </title>
<Script>
Function Page (iAbsolute, sTableId, sTBodyId, page)
{
This. absolute = iAbsolute; // maximum number of records per page
This. tableId = sTableId;
This. tBodyId = sTBodyId;
This. rowCount = 0; // number of records
This. pageCount = 0; // Number of pages
This. pageIndex = 0; // page index
This. _ oTable _ = null; // Table reference
This. _ oTBody _ = null; // the content to be paged
This. _ dataRows _ = 0; // record row Reference
This. _ oldTBody _ = null;
This. _ init _ (); // initialization;
};
/**//*
Initialization
*/
Page. prototype. _ init _ = function (){
This. _ oTable _ = document. getElementById (this. tableId); // obtain table reference
This. _ oTBody _ = this. _ oTable _. tBodies [this. tBodyId]; // obtain the tBody reference
This. _ dataRows _ = this. _ oTBody _. rows;
This. rowCount = this. _ dataRows _. length;
Try {
This. absolute = (this. absolute <= 0) | (this. absolute> this. rowCount )? This. rowCount: this. absolute;
This. pageCount = parseInt (this. rowCount % this. absolute = 0
? This. rowCount/this. absolute: this. rowCount/this. absolute + 1 );
} Catch (exception ){}
This. _ updateTableRows __();
};
Page. prototype. GetBar = function (obj)
{
Var bar = document. getElementById (obj. id );
Bar. innerHTML = "per page" + this. absolute + "entries/total" + this. rowCount + "entries"; // 2nd pages/6 Pages in total homepage Previous Page 1 2 3 4 5 6 next page last page
}
/**//*
Next Page
*/
Page. prototype. nextPage = function (){
If (this. pageIndex + 1 <this. pageCount ){
This. pageIndex + = 1;
This. _ updateTableRows __();
}
};
/**//*
Previous Page
*/
Page. prototype. prePage = function (){
If (this. pageIndex> = 1 ){
This. pageIndex-= 1;
This. _ updateTableRows __();
}
};
/**//*
Homepage
*/
Page. prototype. firstPage = function (){
If (this. pageIndex! = 0 ){
This. pageIndex = 0;
This. _ updateTableRows __();
}
};
/**//*
Last page
*/
Page. prototype. lastPage = function (){
If (this. pageIndex + 1! = This. pageCount ){
This. pageIndex = this. pageCount-1;
This. _ updateTableRows __();
}
};
/**//*
Page Locating Method
*/
Page. prototype. aimPage = function (){
Var abc = document. getElementById ("pageno ");
Var iPageIndex = abc. value;
Var iPageIndex = iPageIndex * 1;
If (iPageIndex> this. pageCount-1 ){
This. pageIndex = this. pageCount-1;
} Else if (iPageIndex <0 ){
This. pageIndex = 0;
} Else {
This. pageIndex = iPageIndex-1;
}
This. _ updateTableRows __();
};
/**//*
When the page is executed, update the display table content
*/
Page. prototype. _ updateTableRows _ = function (){
Var iCurrentRowCount = this. absolute * this. pageIndex;
Var iMoreRow = this. absolute + iCurrentRowCount> this. rowCount? This. absolute + iCurrentRowCount-this. rowCount: 0;
Var tempRows = this. _ cloneRows __();
Var removedTBody = this. _ oTable _. removeChild (this. _ oTBody __);
Var newTBody = document. createElement ("TBODY ");
NewTBody. setAttribute ("id", this. tBodyId );
For (var I = iCurrentRowCount; I <this. absolute + iCurrentRowCount-iMoreRow; I ++ ){
NewTBody. appendChild (tempRows [I]);
}
This. _ oTable _. appendChild (newTBody );
This. _ dataRows _ = tempRows;
This. _ oTBody _ = newTBody;
// Footer display score
Var divFood = document. getElementById ("divFood"); // pagination Toolbar
DivFood. innerHTML = "";
Var rightBar = document. createElement ("divFood ");
RightBar. setAttribute ("display ","");
RightBar. setAttribute ("float", "left ");
RightBar. innerHTML = "th" + (this. pageIndex + 1) + "Page/total" + this. pageCount + "page ";
Var isOK = "Y ";
Var cssColor = "";
DivFood. appendChild (rightBar );
/// Display the footer by PAGE
};
/**//*
Clone a collection of original operation rows
*/
Page. prototype. _ cloneRows _ = function (){
Var tempRows = [];
For (var I = 0; I <this. _ dataRows _. length; I ++ ){
TempRows [I] = this. _ dataRows _ [I]. cloneNode (1 );
}
Return tempRows;
};
</Script>
<Script type = "text/javascript" language = "javascript">
Window. onload = function (){
Page = new Page (3, 'senfe ', 'Group _ one ');};
</Script>
<Style type = "text/css"> <! --
# Senfe {
Border-top: #000 1px solid;
Border-left: #000 1px solid;
}
# Senfe td {
Border-right: #000 1px solid;
Border-bottom: #000 1px solid;
}
--> </Style>
<Script language = "javascript"> <! --
Function senfe (o, a, B, c, d ){
Var t = document. getElementById (o). getElementsByTagName ("tr ");
For (var I = 0; I <t. length; I ++ ){
T [I]. style. backgroundColor = (t [I]. sectionRowIndex % 2 = 0 )? A: B;
}
}
--> </Script>
</Head>
<Body>
<Div>
<Table border = "0" cellpadding = "0" cellspacing = "0" bordercolor = "#006600" id = "senfe">
<Thead>
<Tr align = "center" valign = "middle">
<Td width = "46" height = "23" bgcolor = "# FFFFFF"> NO. </td>
<Td width = "71" bgcolor = "# FFFFFF"> <select name = "select" dir = "ltr">
<Option> set Category </option>
<Option> set A </option>
<Option> B </option>
</Select> </td>
<Td width = "53" bgcolor = "# FFFFFF"> name </td>
<Td width = "53" bgcolor = "# FFFFFF"> quantity </td>
<Td width = "53" bgcolor = "# FFFFFF"> unit price </td>
<Td width = "95" bgcolor = "# FFFFFF"> <select name = "select" dir = "ltr">
<Option> Unit </option>
<Option> items </option>
<Option> double </option>
</Select> </td>
<Td width = "80" bgcolor = "# FFFFFF"> hotel name </td>
<Td width = "35" bgcolor = "# FFFFFF"> remarks </td>
</Tr>
</Thead>
<Tbody id = "group_one">
<Tr>
<Td> 1 </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
</Tr>
<Tr>
<Td> 2 </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
</Tr>
<Tr>
<Td> 3 </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
</Tr>
<Tr>
<Td> 4 </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
</Tr>
<Tr>
<Td> 5 </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
</Tr>
<Tr>
<Td> 6 </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
</Tr>
<Tr>
<Td> 7 </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
</Tr>
<Tr>
<Td> 8 </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
</Tr>
<Tr>
<Td> 9 </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
<Td> </td>
</Tr>
</Tbody>
</Table>
<Script language = "javascript"> <! --
// Senfe ("table name", "odd row background", "even row background", "move the mouse over background", "click background ");
Senfe ("senfe", "# fff", "# ccc", "# cfc", "# f00 ");
--> </Script>
</Div>
<Div> <a href = "#" onclick = "page. firstPage (); "> first page </a>/<a href =" # "onclick =" page. nextPage (); "> next page </a>/<a href =" # "onclick =" page. prePage (); "> previous page </a>/<a href =" # "onclick =" page. lastPage (); "> last page </a> <span id =" divFood ">
</Span>
/No
<Input id = "pageno" value = "1" style = "width: 20px"/> page/<a href = "#" onclick = "page. aimPage (); "> jump </a> </div>
</Div>
</Div>
</Body>
</Html>
