- function initPage() {
- // 循环生成数组
- var arr = [];
- for (var o = 0; o <totalNumber; o++) {
- arr.push(o);
- }
- // 每一页第一个 li
- var rangeStartitem = (currentPage - 1) * pageSize;
- // 开始页
- var rangeStart = Math.max(1, currentPage - parseInt(maxButtons / 2));
- // 最后一页
- var rangeEnd = Math.min(totalPage, rangeStart + maxButtons - 1);
- var constr = pageCon(arr, rangeStartitem, pageSize);
- var divcontent = document.getElementById("content");
- divcontent.innerhtml = constr;
- // 创建分页模板
- var str = "";
- str += "<div class='pagination'>";
- str += "当前第" + currentPage + "页"
- // 如果总页数大于 1
- if (totalPage> 1) {
- // 当前页不是第一页
- if (currentPage != 1) {
- str += '<a href="#!"data-num="1"><span>|<</span></a>';
- str += '<a href="#!"data-num="' + (currentPage - 1) + '"><span><<</span></a>';
- } else {
- // 如果是第一页, 禁用上一页按钮
- str += '<span>|<</span>';
- str += '<span><<</span>';
- }
- // 中间页码
- for (var i = rangeStart; i <= rangeEnd; i++) {
- // 如果是当前页的话, 就禁用当前页的按钮
- if (i == currentPage) {
- str += '<span class="on">' + i + "</span>";
- } else {
- // 否则就可以点击该页
- str += '<a href="#"data-num="' + i + '"><span>' + i + "</span></a>";
- }
- }
- // 当前页不是总页, 即是最后一页
- if (currentPage != totalPage) {
- str += '<a href="#"data-num="' + (currentPage + 1) + '"><span>>></span></a>';
- str += '<a href="#"data-num="' + totalPage + '"><span>>|</span></a>';
- } else {
- // 如果是最后页, 禁用下一页
- str += '<span>>></span>';
- str += '<span>>|</span>';
- }
- }
- str += '一共' + totalPage + '页,' + totalNumber + '条记录 </div>';
- var divpager = document.getElementById("pager");
- divpager.innerHTML = str;
- // 获取所有生成的页面链接
- var listTag = divpager.getElementsByTagName('a');
- // 绑定 li 事件
- for (var i = 0; i <listTag.length; i++) {
- listTag[i].onclick = function() {
- var currentPage = this.getAttribute('data-num');
- nowcurrentPage(currentPage);
- return false;
- };
- }
- }
- // 传递页面
- function nowcurrentPage(currentPage) {
- this.currentPage = currentPage;
- initPage();
- }
- // 生成每页的数据
- function pageCon(arr, rangeStartitem, len) {
- var constr = '';
- for (var i = rangeStartitem; i < rangeStartitem + len; i++) {
- constr += "<li>"+ arr[i] + "</li>";
- }
- return constr;
- }
- </script>
- </body>
- </HTML>
来源: http://www.bubuko.com/infodetail-2961905.html