一个较简易的分页javascript类

来源:互联网 发布:mysql更新语句怎么写 编辑:程序博客网 时间:2024/04/30 08:06
/**
* Pager.js
* @author BLACK CAT
* @email 
34298824@qq.com
* @version 1.0
* sample:
*  window.onload=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);
 }
原创粉丝点击