例子,javascript显示分页按钮的代码。
/**
* 获取分页按钮
* @param total_page 总页数
* @param current_page 当前页
* @param num每页显示多少个分页按钮
* @returns {String}
*/ www.jb200.com
function get_page_html(total_page,current_page,num){
var page_html = "";
if(isNaN(total_page) && isNaN(current_page)){
}else{
//范围判断
if(current_page>total_page) {
current_page = total_page;
}
// 当前页的前后各显示多少页
var count = Math.floor(num/2);
// 当前页后面要显示的页数
var after_count = count;
if(count-current_page>0){
after_count += (count-current_page);
}
if(total_page<=1) {
//只有一页
page_html += '<ul class="pagination">';
page_html += '<li class="active"><a href="javascript:pageQuery(1)">1</a></li>';
page_html += '</ul>';
}else if(total_page<=num){
page_html += '<ul class="pagination">';
//把页数全部显示出来
for(var i=1;i<=total_page;i++) {
if(current_page==i){
page_html += '<li class="active"><a href="javascript:pageQuery('+current_page+')">'+current_page+'</a></li>';
}else{
page_html += '<li><a href="javascript:pageQuery('+i+')">'+i+'</a></li>';
}
}
page_html += '</ul>';
}else {
page_html += '<ul class="pagination">';
//显示前一页按钮
if(current_page-count>1) {
page_html += '<li><a href="javascript:pageQuery('+(current_page-1)+')">«</a></li>';
}
//显示当前页前面的页码按钮
for(var i=count;i>=1;i--) {
if(current_page-i>0){
page_html += '<li><a href="javascript:pageQuery('+(current_page-i)+')">'+(current_page-i)+'</a></li>';
}
}
// 当前页按钮
page_html += '<li class="active"><a href="javascript:pageQuery('+current_page+')">'+current_page+'</a></li>';
// 显示当前页后面的页码按钮
for(var j=1;j<=after_count;j++){
if((current_page+j)<=total_page){
page_html += '<li><a href="javascript:pageQuery('+(current_page+j)+')">'+(current_page+j)+'</a></li>';
}
}
//显示后一页按钮
if(current_page+count<total_page){
page_html += '<li><a href="javascript:pageQuery('+(current_page+1)+')">»</a></li>';
}
page_html += '</ul>';
}
}
return page_html;
}
效果: