js的一个分页逻辑

  /*javascript

    页面显示的效果为[前10页 1 2 3 4 5 6 7 8 9 10 后10页],即一页显示10个页号java

思路根据传入页面的当前页pageNo,运用Math.floor((lps.pageNo-1)/10)方法判断当前页号在第几页(0为第一页);app

 */spa

     var divBegin = $("<div class='next'></div>");ip

    var prePage;it

    var nextPage; class

// 判断当前"页号"在第几页cli

     var indexPage =  Math.floor((lps.pageNo-1)/10);方法

 // 表示在第1页显示,这时“前10页”按钮无效next

     if(indexPage==0){

     prePage= $("<a href='javascript:' class='cur'>前10页</a>"); 

     }else{

     prePage= $("<a href='javascript:' onclick='triggerCon({pageNo:"+(lps.pageNo-10)+"})' class='cur'>前10页</a>");

     }

 // 添加“前10页”按钮

     divBegin.append(prePage);

 // 查找当前"页号"所在页的“首页”

     var startPage = indexPage*10+1;

     var endPage;

 // 若是当前"页号"所在页的“首页”+9不超过总页数lps.count,则当前页有10个页号

 // 不然总页数lps.count就是当前页的最后一个“页号”

     if((startPage+9)<=lps.count){

     endPage = startPage+10;

     }else{

     endPage=lps.count+1;

     }

     // 根据当前“页号”所在页的“首页”和“尾页”生成页码

     for(var i=startPage;i<endPage;i++ ){

     var temp;

     if(i==lps.pageNo){

    // 当前页码有样式class='hover'

     temp = $("<a href='javascript:' class='hover' onclick='triggerCon({pageNo:"+i+"})' id='pageNo"+i+"'>"+i+"</a>");

     }else{

     temp = $("<a href='javascript:' onclick='triggerCon({pageNo:"+i+"})' id='pageNo"+i+"'>"+i+"</a>");

     } 

    divBegin.append(temp);

     }

 // 同理判断当前"页号"是否是和“总页数”在同一个页面,若是是“后10页”按钮不起做用

     if(indexPage== Math.floor((lps.count-1)/10)){

     nextPage= $("<a href='javascript:' class='cur'>前10页</a>");

     }else{

     nextPage= $("<a href='javascript:' onclick='triggerCon({pageNo:"+(lps.pageNo+10)+"})' class='cur'>前10页</a>");

     }

     divBegin.append(nextPage);

     // 将页码添加

     $("#kcyl_rbox").append(divBegin);

}

相关文章
相关标签/搜索