发布一个 分页条js实现... 很好用啊

function renderPaging(url,curPage,totalPage)


{


	var pageBarNum = 5;


	var pageStr = '';


	


	var gurl = function(num){


		return url.replace('-page-',num);


	};





	curPage = parseInt(curPage);


	totalPage = parseInt(totalPage);


	


	if(curPage > 1){


		pageStr += '<span class="grey-12">&lt;&lt;&nbsp;<a class="paging-per" href="' + gurl(curPage-1) + '">上一页</a>&nbsp;</span>';


	}	


	


	var index = Math.floor(pageBarNum/2);


	var start = (curPage-index)>0 ? (curPage-index) : 1;


	var end = curPage + (pageBarNum-index);


	end = end<pageBarNum ? pageBarNum : end;


	


	if(start > 1){


		pageStr += '<span class="grey-12">&nbsp;<a class="paging-per" href="' + gurl(1) + '">1</a>&nbsp;</span>';


	}


	


	if(start > 2){pageStr += '<span class="grey-12">&nbsp;...&nbsp;</span>';}


	


	for(var i=start; i<end; i++){


		if(i>totalPage) break;


		if(i == curPage){


			pageStr += '<span class="blue-12-bold">&nbsp;<a class="paging-per paging-current" href="' + gurl(i) + '">' + i + '</a>&nbsp;</span>';


		}else{


			pageStr += '<span class="grey-12">&nbsp;<a class="paging-per" href="' + gurl(i) + '">' + i + '</a>&nbsp;</span>';	


		}


	}


	


	if(end < totalPage){


		pageStr += '<span class="grey-12">&nbsp;...&nbsp;</span>';


		pageStr += '<span class="grey-12">&nbsp;<a class="paging-per" href="' + gurl(totalPage) + '">' + totalPage + '</a>&nbsp;</span>';


	}


	


	if(curPage < totalPage){


		pageStr += '<span class="grey-12">&nbsp;<a class="paging-per" href="' + gurl(curPage+1) + '">下一页</a>&nbsp;&gt;&gt;</span>';


	}


	


	return pageStr;


}

 

 

后端只需要 传入 3个参数即可

$pager = array(
    		'pagecount' => ceil($counter / $numPerPage),
    		'url' => 'url.php/page/-page-'
    		'page' => $cur_page,
    	);
    	
$this->_view['pager'] = $pager;

 

demo:

<p id="pageBar" page="<?php echo $pager['page'];?>" pagecount="<?php echo $pager['pagecount'];?>" url="<?php echo $pager['url'];?>"></p>
 

 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值