javascript 仿百度分页函数

来源：互联网发布：简述信息和数据的关系编辑：程序博客网时间：2024/05/22 03:17

/**  * Ajax分页功能  * 在需要分页的地方添加<ul class="pagination"></ol>  * 作为分页组件容器元素。  * pageCount 总页数  * currentPage 当前页数  * container 带有pagination类的ol容器元素  * loadData 用于加载数据的函数  * version 1.0  */pagination : function(pageCount, currentPage, container, loadData) {this.startPage = 1;this.endPage = pageCount;this.minDisplayPageCount = 5;var c = $(container);var paginationLinks = "";if(pageCount == 1) {c.css({'visibility': 'hidden'});return;}if(pageCount > this.minDisplayPageCount + 1) {if(currentPage - this.minDisplayPageCount > 0) {this.startPage = currentPage - this.minDisplayPageCount;}if((currentPage + this.minDisplayPageCount - 1) < pageCount) {this.endPage = currentPage + this.minDisplayPageCount - 1;} else {this.endPage = pageCount;} }paginationLinks += "<ul>"; if(currentPage != 1) {paginationLinks += "<li><a id='prevpage' href='javascript:;' rel='prev'>《上一页</a></li>";}for(var i = this.startPage; i <= this.endPage; i++) {if(currentPage == i) {paginationLinks += "<li id='page_" + currentPage + "_container'><a id='page_" + i + "' class='current' href='javascript:;'>" + currentPage + "</a></li>";} else {paginationLinks += "<li id='page_" + i + "_container'><a id='page_" + i + "' href='javascript:;'>" + i + "</a></li>";}}if(currentPage < pageCount) {paginationLinks += "<li><a id='nextpage' href='javascript:;' rel='next'>下一页》</a></li>";}paginationLinks += "</ul>";c.html(paginationLinks);var links = $("#page_number ul li a");links.each(function(index) {if(!(this.innerHTML == "上一页" || this.innerHTML == "下一页")) {$(this).click(function(event) {alert(links[index].innerHTML);loadData(curTaskId,"","",parseInt(links[index].innerHTML));pagination(pageCount, parseInt(links[index].innerHTML), container, loadData);});}});var prevPage = $("#prevpage");var nextPage = $("#nextpage");c.css({'visibility': 'visible'});if(prevPage) {prevPage.click(function(event) {loadData(curTaskId,"","",currentPage - 1);pagination(pageCount,  currentPage - 1, container, loadData);});}if(nextPage) {nextPage.click(function(event) {loadData(curTaskId,"","",currentPage + 1);pagination(pageCount, currentPage + 1, container, loadData);});}}

loadData为加载数据的函数，这个函数需要定义一个当前页数的参数，比如：

var currentPage = 1;

loadExamList(currentPage){

//TODO

pagination(5,currentPage,$(ul),loadExamList);

};

5是总页数，1是当前页数，$(ul)是要将页码按钮存放的位置，loadExamList是点击上一页、下一页或者页码的时候调用的函数。