模拟ASP.Net分页的分页导航

标签：

 获得如下分页导航   |<< < ... 9 10 11 12 13 14 15 16  ... > >>| 

习惯了C的带类型编程，不大习惯JS的无类型编程。搞了半天才发现是类型错误...-  -  还是都取下整比较保险

  //containerId 导航的目标容器，建议使用span标签
        //url 默认为XXX.XX?pagenum=
        //curPage 当前的页码
        //maxSection 最大的分段数(一段里面最大的页数)
        //totalPage 总共的页数
        function Navigate(containerId,url,curPage,maxSection, totalPage) {
            //到第一页符号
            var first = "|<<";
            //到最后一页符号
            var last = ">>|";
            //前一页符号
            var back = "<"
            //下一页符号
            var next = ">";
            //非法页码处理 
            if (curPage > totalPage || curPage < 0) {
                curPage = 1;
            }
            //获得导航容器父元素
            var containerObj = document.getElementById(containerId);
            //获得当前页所在的分段号(调试了老半天原来是类型问题，居然是float型)
            var curSection = Math.floor((curPage - 1) / maxSection + 1);
            //获得最后一个分段的号
            var lastSection = Math.floor((totalPage - 1) / maxSection + 1);
            var html = "";
            //当前页不是第1页，添加到首页，和前一页
            if (curPage > 1) {
                html += "<a href='" + url + "1'>" + first + "</a> ";
                html += "<a href='" + url + (curPage - 1) + "'>" + back + "</a> ";
            }
            //当前不是第一段，则显示上一段符号
            if (curSection > 1) {
                //获得上一段的第一页号码
                var backSectionFirstPage = (curSection-2) * maxSection + 1;
                html += "<a href='" + url + backSectionFirstPage + "'>...</a> ";
            }
            //当前段的第一页号码
            var curSectionFirst = (curSection - 1) * maxSection + 1;
            //当前段的第最后一页号码
            var curSecitonLast = curSection * maxSection;
            //输出当前段的页码
            for (var i = curSectionFirst; i <= curSecitonLast && i <= totalPage; i++) {
                if (curPage == i) {
                    html += "<a style = 'color:Red' href='" + url + i + "'>" + i + "</a> ";
                }
                else { 
                    html += "<a href='" + url + i + "'>" + i + "</a> ";
                }
            }
            //当前不是最后一段，则显示下一段符号
            if (curSection < lastSection) {
                //获得下一段的第一页号码
                var nextSectionFirstPage = curSection * maxSection + 1;
                html += "<a href='" + url + nextSectionFirstPage + "'>...</a> ";
            }
            //当前页不是第最后页，添加下一页和最后一页符号
            if (curPage != totalPage) {
                html += "<a href='" + url + (curPage + 1) + "'>" + next + "</a> ";
                html += "<a href='" + url + totalPage + "'>" + last + "</a> ";
            }
            containerObj.innerHTML = html;
        }

模拟ASP.Net分页的分页导航

标签：

原文地址：http://blog.csdn.net/jiangpeng59/article/details/45000483