Home > Web Front-end > JS Tutorial > body text

js table paging implementation code_javascript skills

WBOY
Release: 2016-05-16 18:45:56
Original
1187 people have browsed it

Copy code The code is as follows:



<머리>







料库管理
<스크립트>
함수 페이지(iAbsolute,sTableId,sTBodyId,page)
{
this.absolute = iAbsolute; //每页最大记录数
this.tableId = sTableId;
this.tBodyId = sTBodyId;
this.rowCount = 0;//记录数
this.pageCount = 0;//页数
this.pageIndex = 0;//页索引
this.__oTable__ = null;//表格引用
this.__oTBody__ = null;//要分页内容
this.__dataRows__ = 0;//记录行引用
this.__oldTBody__ = null;
this.__init__(); //初始화;
};
/**//*
초기화
*/
Page.prototype.__init__ = function(){
this.__oTable__ = document.getElementById(this.tableId);//获取table引用
this. __oTBody__ = this.__oTable__.tBodies[this.tBodyId];//获取tBody용
this.__dataRows__ = this.__oTBody__.rows;
this.rowCount = this.__dataRows__.length;
시도해 보세요{
this.absolute = (this.absolute <= 0) || (this.absolute>this.rowCount) ? this.rowCount : this.absolute;
this.pageCount = parsInt(this.rowCount%this.absolute == 0
? this.rowCount/this.absolute : this.rowCount/this.absolute 1);
}catch(예외){}
this.__updateTableRows__();
};
Page.prototype.GetBar=function(obj)
{
var bar= document.getElementById(obj.id);
bar.innerHTML= "每页" this.absolute "条/共" this.rowCount "条";// 第2页/共6页 首页 上一页 1 2 3 4 5 6 下一页 末页
}
/**//*
다음 페이지
*/
Page.prototype.nextPage = function(){
if(this.pageIndex 1 < this.pageCount){
this.pageIndex = 1;
this.__updateTableRows__();
}
};
/**//*
이전 페이지
*/
Page.prototype.prePage = function(){
if(this.pageIndex >= 1){
this.pageIndex -= 1;
this.__updateTableRows__();
}
};
/**//*
홈페이지
*/
Page.prototype.firstPage = function(){
if(this.pageIndex != 0){
this.pageIndex = 0;
this.__updateTableRows__();
}
};
/**//*
마지막 페이지
*/
Page.prototype.lastPage = function(){
if(this.pageIndex 1 != this.pageCount){
this.pageIndex = this.pageCount - 1;
this.__updateTableRows__();
}
};
/**//*
페이지 위치 지정 방법
*/
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__();
};
/**//*
페이징 수행 시 표시된 테이블 내용을 업데이트합니다.
*/
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 selectedTBody = 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;
//页脚显示分
var divFood = document.getElementById("divFood");//分页工具栏
divFood.innerHTML="";
var rightBar = document.createElement("divFood");
rightBar.setAttribute("display","");
rightBar.setAttribute("float","left");
rightBar.innerHTML="第" (this.pageIndex 1) "页/共" this.pageCount "页";
var isOK="Y";
var cssColor="";
divFood.appendChild(rightBar);
////页脚显示分页结
};
/**//*
원래 작업 행 컬렉션 복제
*/
Page.prototype.__cloneRows__ = function(){
var tempRows = [];
for(var i=0; itempRows[i] = this.__dataRows__[i].cloneNode(1);
}
tempRows를 반환합니다.
};














































































































编号 名称 数量 单价 酒店名称 备注
1              
2              
3              
4              
5              
6              
7              
8              
9 td>

Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template