/** *分页工具条初始化 * *@param {string} [pageId] [页面分页工具栏外层容器标签ID] *@param {number} [sumPage] [总页数] *@param {number} [currPage] [当前页] * *@author:h51701 *@date:2017/3/27 * */ pageUtil("#page",40,8); function pageUtil(element,sumPage,curPage){ //off 每次绑定事件前先卸载多个事件 $(element).off("click", "a").on("click","a",function(){ index = $(this).text(); switch(index){ case "首页": pageUtil(element,sumPage,1); break; case "<<上一页": if(startPage == 1) break; pageUtil(element,sumPage,curPage-1); break; case "下一页>>": if(curPage == sumPage) break; pageUtil(element,sumPage,curPage+1); break; case "尾页": pageUtil(element,sumPage,sumPage); break; default: pageUtil(element,sumPage,parseInt(index)); break; } }); //分页工具条主结构 var mainStr = '<a href="" class="last" onclick="return false">下一页>></a>'; mainStr = curPage == 1 ? "" + mainStr : '<a href="" class="last" onclick="return false"><<上一页</a>' + mainStr; mainStr = curPage > 5 ? '<a href="" onclick="return false">首页</a>' + mainStr : mainStr; mainStr += curPage > 10 && curPage < (sumPage-5) ? '<a href="" onclick="return false">尾页</a>' : ""; $(element).html(mainStr); //确认页码起始数字 var startPage = curPage < 6 ? 1 : curPage-4, pageNumStr = ""; //若起始页数小于最后一页 并且 循环不大于十次 for(var i=0;startPage<=sumPage&&i<10;i++){ startPage == curPage ? pageNumStr += "<a href='' class='red' onclick='return false'>"+startPage+"</a>" : pageNumStr += "<a href='' onclick='return false'>"+startPage+"</a>"; startPage++; } //添加 $(element).find("a:contains('下一页')").before(pageNumStr); }
简单的分页控件,输入容器id值即可。