一个较简易的分页javascript类

最新推荐文章于 2022-08-19 17:37:08 发布

shipblog

最新推荐文章于 2022-08-19 17:37:08 发布

阅读量1k

点赞数

文章标签： javascript function class list border google

本文链接：https://blog.csdn.net/shipblog/article/details/908985

版权

/**
* Pager.js
* @author BLACK CAT
* @email 34298824@qq.com
* @version 1.0
* sample:
* window.οnlοad=function(){
* var pager=new Pager(4,10,'pageCodeContainerID','formID');
* pager.init();
* pager.view('pager','pagerContainerID');
* }
* _currentPage:当前页码
* _pageSum: 页总数
* _pageCodeContainer:页码容器元素ID，包含在表单中
* _pagerActionForm:用于发送分页请求的表单ID
*
*
* 如果有人觉得还有点用途，可以任意修改使用:)
*/
function Pager(_currentPage,_pageSum,_pageCodeContainer,_pagerActionForm)
{
var pageNum=_pageSum;
var currentPage=_currentPage;
var list=new Array();
/**
* 类似于google的滚动分页
*/
this.init=function()
{
  for(var k=currentPage-3;k<=currentPage+3;k++)
  {
   if(k<0)continue;
   if(k>=pageNum)break;

   list.push(k);
  }
}
this.thePage=function(_page)
{
  this.get(_pageCodeContainer).value=_page;
  this.get(_pagerActionForm).submit();
}
/**
* _pager:分页类对象
* _pagerContainer:分页导航条放置的容器元素ID
*/
this.view=function(_pager,_pagerContainer)
{
  var viewDIV="<div>";
  viewDIV+="<table border='0' cellspacing='0' cellpadding='0' class='pager'><tr>";
  viewDIV+="<td width='35px' class='pager_head'><a href='javascript:"+_pager+".thePage(1);'>首页</a></td>";

  var length=list.length;
  var page=0;
  for(var k=0;k<length;k++)
  {
   page=list[k]+1;
   viewDIV+="<td width='25px' class='pager_code'><a href='javascript:"+_pager+".thePage("+page+");'>"+page+"</a></td>";
  }
  viewDIV+="<td width='35px' class='pager_end'><a href='javascript:"+_pager+".thePage("+pageNum+");'>尾页</a></td>";

  viewDIV+="</tr></table>";
  viewDIV+="</div>";

  var pagerContainer=document.getElementById(_pagerContainer);
  pagerContainer.innerHTML=viewDIV;
}
this.get=function(id)
{
  return document.getElementById(id);
}
}