JS 分页

http://liujinzhong.iteye.com/blog/369975

 

用一个自动生成代码的工具进行编程。后台逻辑不能太复杂了。

 

其中涉及到了checkbox的分页,试试用JS分页实现。

 

因为是checkbox,如果是sql实现分页,每次动态刷新页面,前一页所选的值就无法保持了。

 

<script>
function goPage(pno,psize){
 
 var itable = document.getElementById("idData");
 
 var num = itable.rows.length;//表格行数
 
 var totalPage = 0;//总页数
 
 var pageSize = psize;//每页显示行数
 
 if((num-1)/pageSize > parseInt((num-1)/pageSize)){  
 
     totalPage=parseInt((num-1)/pageSize)+1;  
 
    }else{  
 
     totalPage=parseInt((num-1)/pageSize);  
 
    }  
 
 var currentPage = pno;//当前页数
 
 var startRow = (currentPage - 1) * pageSize+1;//开始显示的行  
 
    var endRow = currentPage * pageSize+1;//结束显示的行  
 
    endRow = (endRow > num)? num : endRow;
 
 //前三行始终显示
 
 for(i=0;i<1;i++){
 
  var irow = itable.rows[i];
 
  irow.style.display = "block";
 
 }
 
 

 for(var i=1;i<num;i++){
 
  var irow = itable.rows[i];
 
  if(i>=startRow&&i<endRow){
 
   irow.style.display = "block"; 
 
  }else{
 
   irow.style.display = "none";
 
  }
 
 }
 
 var pageEnd = document.getElementById("pageEnd");
 
 var tempStr = "共"+(num-1)+"条记录 分"+totalPage+"页 当前第"+currentPage+"页";
 
 if(currentPage>1){
 
  tempStr += "<a href=\"#\" onClick=\"goPage("+(currentPage-1)+","+psize+")\">上一页</a>"
 
 }else{
 
  tempStr += "上一页"; 
 
 }
 
 if(currentPage<totalPage){
 
  tempStr += "<a href=\"#\" onClick=\"goPage("+(currentPage+1)+","+psize+")\">下一页</a>";
 
 }else{
 
  tempStr += "下一页"; 
 
 }
 
 if(currentPage>1){
 
  tempStr += "<a href=\"#\" onClick=\"goPage("+(1)+","+psize+")\">首页</a>";
 
 }else{
 
  tempStr += "首页";
 
 }
 
 if(currentPage<totalPage){
 
  tempStr += "<a href=\"#\" onClick=\"goPage("+(totalPage)+","+psize+")\">尾页</a>";
 
 }else{
 
  tempStr += "尾页";
 
 }
 
 document.getElementById("barcon").innerHTML = tempStr;
 
 

}

 
 
 </script>
 
 
 
 


<html>
 
<head>
 
 
 
</head>
 
<body onLoad="goPage(1,2);">
 
 <table id="idData" width="70%">
 
  <tr>
 
   <td>姓名</td>
 
   <td>年龄</td>
 
   <td>性别</td>
 
   <td>户籍</td>
 
  </tr>

......

</table>

</body>

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值