分页无刷新

来源:互联网 发布:何为网络综艺 编辑:程序博客网 时间:2024/03/29 23:18

var pageSize=3,currentPageNum=1,totlePageNum
var obj,totleRows,totleCols
var rowHeigth = 20;
function page() {
   
    totleRows=document.getElementById('tab1').rows.length;
    totleCols=document.getElementById('tab1').rows(0).cells.length;
    totlePageNum=Math.ceil((totleRows-1)/pageSize)
    //如果某一页行数小于pageSize,则增加空行
    //document.getElementById("totlePageNume").innerHTML="第"+"<font color='red'>"+currentPageNum.toString()+"</font">+" / "+totlePageNum.toString()+"页";     
     N(0); 

}
function pageys(ys)
{
currentPageNum=ys;
resetStyle();
    toPage(currentPageNum);
    filter(currentPageNum);
    shuzipage();
}
function shuzipage()
{
document.getElementById("fys").innerHTML="";
var pstart = currentPageNum - 5 > 0 ? currentPageNum - 5 : 0;
          var pend = currentPageNum + 5 > totlePageNum ? totlePageNum : currentPageNum + 5;
           if (pstart == 0)
           {
               pend = totlePageNum > 10 ? 10 : totlePageNum;
           }
           if (pend == totlePageNum)
           {
               pstart = pend - 10 > 0 ? pend - 10 : pstart;
           }

           for (var j = pstart; j < pend; j++)
           {
               if ((j+1) == currentPageNum)
               {
                  document.getElementById("fys").innerHTML+="<label>"+(j+1)+"</label>";

               }
               else
               {
                   document.getElementById("fys").innerHTML+="<a href='#' onclick=/"pageys("+(j+1)+")/" >"+"["+(j+1)+"]"+"</a>";
               }
           }                  
}
function resetStyle(){
    for (var i=1;i<totleRows;i++)document.getElementById('tab1').rows[i].style.display="none"
}
function N(k){
    if (k>0 && currentPageNum>=totlePageNum ||k<0 && currentPageNum<=1)return;   
    currentPageNum+=k;
    shuzipage();
    resetStyle();
    toPage(currentPageNum);
    filter(currentPageNum);
   
}
function firstOrLast(flag){
    if(flag==0)
        currentPageNum = 1;
    else if(flag==1)
        currentPageNum = totlePageNum;
    else
        return ;
    resetStyle();
    toPage(currentPageNum);
    filter(currentPageNum);

}


function toPage(currentPageNum){
//     var scurrent=currentPageNum-1;
//     if(scurrent==0)
//     {
//       for(var m=1;m<=pageSize;m++)
//       {
//       document.getElementById('tab1').rows[m].style.display="";
//       }
//     }
//     else
//     {
//     for (var i=scurrent*pageSize+1;i<totleRows;i++)      
//       {
//       document.getElementById('tab1').rows[i].style.display="";
//       }
//       }     
         if(currentPageNum!=totlePageNum)
         {
            for (var i=(currentPageNum-1)*pageSize+1;i<=currentPageNum*pageSize;i++)      
            {
                document.getElementById('tab1').rows[i].style.display="";
            }
         }
         else
         {
            var pageadd=(totleRows-1)%pageSize;
            for(var j=(currentPageNum-1)*pageSize+1;j<=((currentPageNum-1)*pageSize+pageadd);j++)
            {
            document.getElementById('tab1').rows[j].style.display="";
            }
         }
      
     
}

function filter(currentPageNum){
        //如果是第一页,则“上一页”不可用
    if(currentPageNum-1<1) {
        document.getElementById("back").disabled=true;
        document.getElementById("first").disabled=true;
    }
    else{
        document.getElementById("back").disabled=false;
        document.getElementById("first").disabled=false;
    }
    //如果是最后一页,则"下一页"不可用
    if(currentPageNum+1>totlePageNum ) {
        document.getElementById("next").disabled=true;
        document.getElementById("last").disabled=true;
    }
    else{
        document.getElementById("next").disabled=false;
        document.getElementById("last").disabled=false;
    }
}

      <input id="first" type=button value="第一页" onclick="firstOrLast(0)">
<input id="back" type=button value="上一页" onclick="N(-1)">
<span id="totlePageNume"></span>
<span id="fys"></span>
<input id="next" type=button value="下一页" onclick="N(1)">
<input id="last" type=button value="最后一页" onclick="firstOrLast(1)">