zoukankan      html  css  js  c++  java
  • js得到分页栏

    自己写的,感觉返回html代码蠢蠢的,但是新手并不知道怎么写更好的,感觉这样子也蛮简单。记录下来,以后来越改越好。

    //获得分页栏。注意indexSize为奇数,这样也比较好看
    //totalNum:数据库总记录数,pageSize:每页显示的记录数,indexSize:要显示几个页码,比如下边显示 1 2 3 4 5 indexSize就=5, page:当前页码
    function getPageIndex(totalNum, pageSize, indexSize, page) {
        var pageIndex = "";
        //如果总记录数大于页码显示数量才进行计算
        if (totalNum > pageSize) {
            var totalPage = 0;
            if (totalNum % pageSize == 0) {
                totalPage = totalNum / pageSize;
            }
            else {
                totalPage = Math.floor(totalNum / pageSize) + 1;
            }
            //情况1 总页数<页码数
            if (totalPage < indexSize) {
                for (var i = 1; i <= totalPage; i++) {
                    pageIndex += "<li";
                    if (i == page) {
                        pageIndex += " class='active'";
                    }
                    pageIndex += ">";
                    pageIndex += "<a>" + i + "</a>";
                    pageIndex += "</li>";
                }
            }
            //情况2 总页数>页码数 并且 当前页数位于最后后半段 如 25 26 27 28 29的28页
            else if (totalPage > indexSize && totalPage - page <= ((indexSize - 1) / 2)) {
                for (var i = totalPage - indexSize + 1; i <= totalPage; i++) {
                    pageIndex += "<li";
                    if (i == page) {
                        pageIndex += " class='active'";
                    }
                    pageIndex += ">";
                    pageIndex += "<a>" + i + "</a>";
                    pageIndex += "</li>
    ";
                }
            }
            //情况3 总页数>页码数 并且 当前页数位于最前前半段 如 1 2 3 4 5的2页
            else if (totalPage > indexSize && page <= ((indexSize + 1) / 2)) {
                for (var i = 1; i <= indexSize; i++) {
                    pageIndex += "<li";
                    if (i == page) {
                        pageIndex += " class='active'";
                    }
                    pageIndex += ">";
                    pageIndex += "<a>" + i + "</a>";
                    pageIndex += "</li>
    ";
                }
            }
            //正常情况
            else {
                for (var i = parseInt(page) - Math.floor(indexSize / 2); i <= parseInt(page) + Math.floor(indexSize / 2); i++) {
                    pageIndex += "<li";
                    if (i == page) {
                        pageIndex += " class='active'";
                    }
                    pageIndex += ">";
                    pageIndex += "<a>" + i + "</a>";
                    pageIndex += "</li>
    ";
                }
            }
            //上一页 下一页
            if (page == 1) {
                pageIndex = "<li class='disabled'><a>上一页</a></li>" + pageIndex + "<li><a>下一页</a></li>";
            } else if (page == totalPage) {
                pageIndex = "<li><a>上一页</a></li>" + pageIndex + "<li class='disabled'><a>下一页</a></li>";
            } else {
                pageIndex = "<li><a>上一页</a></li>" + pageIndex + "<li><a>下一页</a></li>";
            }
        }
        return pageIndex;
    }
    

      

  • 相关阅读:
    20190503-汉明距离
    20190501-编写一个函数来查找字符串数组中的最长公共前缀。如果不存在公共前缀,返回空字符串
    20190502-罗马数字转换为数字
    20190501-整数翻转
    20190426-选择排序算法
    Excel技巧—一个公式实现中英文翻译
    Excel技巧—两招轻松搞定汉字转拼音
    Excel基础—开始菜单之花式粘贴四
    Excel技巧—瞬间吸引眼球的WIFI图表
    Excel技巧—自动标记颜色条件格式的妙用
  • 原文地址:https://www.cnblogs.com/coder-axin/p/5019553.html
Copyright © 2011-2022 走看看