本文实例讲述了JavaScript分页功能的实现方法。分享给大家供大家参考。具体实现方法如下：
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(iPageIndex) {
if (iPageIndex > this.pageCount - 1) {
this.pageIndex = this.pageCount - 1;
} else if (iPageIndex < 0) {
this.pageIndex = 0;
} else {
this.pageIndex = iPageIndex;
}
this.updateTableRows();
}
//执行分页时，更新显示表格内容
Page.prototype.updateTableRows = function() {
//pageIndex初始化时为0
//每页显示的数据当前页的索引
var iCurrentRowCount = this.absolute this.pageIndex;
//如果截止到当前页的所有数据+每页显示的数据>总数据条数，则还需要显示this.absolute+ iCurrentRowCount - this.rowCount这些数据，否则，显示0条数据
var iMoreRow = this.absolute + iCurrentRowCount > this.rowCount ? this.absolute
- iCurrentRowCount - this.rowCount
: 0;
var tempRows = this.cloneRows();
//alert(tempRows === this.dataRows);
//alert(this.dataRows.length);
//将tbody从table中移除
var removedTBody = this.oTable.removeChild(this.oTBody);
//重新创建tbody
var newTBody = document.createElement("TBODY");
//给他赋一个id值，为原来的id值
newTBody.setAttribute("id",this.tBodyId);
for (var i = iCurrentRowCount; i < this.absolute + iCurrentRowCount
- iMoreRow; i++) {
//重新给body添加节点
newTBody.appendChild(tempRows[i]);
}
//将新创建的tbody加到table中
this.oTable.appendChild(newTBody);
/
this.dataRows为this.oTBody的一个引用，
移除this.oTBody那么this.dataRows引用将销失,code:this.dataRows = tempRows;恢复原始操作行集合.
/
this.dataRows = tempRows;
this.oTBody = newTBody;
}
//克隆原始操作行集合
Page.prototype.cloneRows = function() {
var tempRows = [];
//将当前body中的所有节点及其子节点都克隆一遍
for (var i = 0; i < this.dataRows.length; i++) {
tempRows[i] = this.dataRows[i].cloneNode(1);
}
return tempRows;
}