zoukankan      html  css  js  c++  java
  • asp.net分页效果实现(使用js) DoTop

    效果如图:

    代码如下:

    //分页
    function UpdatePage(jsontext) {
        //总条数(总条数=总页数*页大小)
        var userCount = jsontext.userCount;
        //总页数
        var pagecount = jsontext.pagecount;
        //当前页
        var pindex = jsontext.pindex;
    
        if (pagecount > 1) {
            sailstr = "<ul class=\"table_page_ul\">";
            if (pindex == 1) {
                sailstr += "";
            }
            else {
                sailstr += "<li class=\"prev\"><a href=\"javascript:void(0)\" onclick=\"GetPage(" + (pindex - 1) + ")\"></a></li>";
            }
            if (Number(pagecount) >= 5) {
                if (pindex == 1) {
                    for (var i = 1; i < 6; i++) {
                        if (i == pindex) {
                            sailstr += "<li class=\"numon\"><a href=\"javascript:void(0)\">" + i + "</a></li>";
                        }
                        else {
                            sailstr += "<li class=\"num\"><a href=\"javascript:void(0)\" onclick=\"GetPage(" + i + ")\">" + i + "</a></li>";
                        }
                    }
                } else if ((Number(pindex) + 4) - Number(pagecount) > 0) {
                    for (var i = Number(pagecount) - 4; i < Number(pagecount) + 1; i++) {
                        if (i == pindex) {
                            sailstr += "<li class=\"numon\"><a href=\"javascript:void(0)\">" + i + "</a></li>";
                        }
                        else {
                            sailstr += "<li class=\"num\"><a href=\"javascript:void(0)\" onclick=\"GetPage(" + i + ")\">" + i + "</a></li>";
                        }
                    }
                } else {
                    for (var i = (Number(pindex) - 1); i < (Number(pindex) + 4); i++) {
                        if (i == pindex) {
                            sailstr += "<li class=\"numon\"><a href=\"javascript:void(0)\">" + i + "</a></li>";
                        }
                        else {
                            sailstr += "<li class=\"num\"><a href=\"javascript:void(0)\" onclick=\"GetPage(" + i + ")\">" + i + "</a></li>";
                        }
                    }
                }
            } else {
                for (var i = 1; i < Number(pagecount) + 1; i++) {
                    if (i == pindex) {
                        sailstr += "<li class=\"numon\"><a href=\"javascript:void(0)\">" + i + "</a></li>";
                    }
                    else {
                        sailstr += "<li class=\"num\"><a href=\"javascript:void(0)\" onclick=\"GetPage(" + i + ")\">" + i + "</a></li>";
                    }
                }
            }
            if (pindex == pagecount) {
                sailstr += "</ul>";
            }
            else {
                sailstr += "<li class=\"next\"><a href=\"javascript:void(0)\" onclick=\"GetPage(" + (Number(pindex) + 1) + ")\"></a></li></ul>";
            }
    
        } else {
            sailstr = "";
        }
        //PageTab是页码显示的div
        $("#PageTab").html(sailstr);
    }
    //页码单击事件
    function GetPage(){
      //写点击页面执行的内容
    }
    
    解释:如上代码函数function UpdatePage(jsontext){}为分页的主要部分,函数要传入一json形式的数据。
    包括userCount(总条数)、pagecount(总页数)、pindex(当前页)。

      

  • 相关阅读:
    hibernate的dialect大全
    jdbc.properties 链接各类数据库的基本配置以及URL写法
    Springboot中redis的学习练习
    博客开通了
    Java String类的hashCode()函数
    Java String类中CaseInsensitiveComparator.compare()方法的实现
    git pull远程所有分支
    Python的权限修饰符
    Tmux快捷键
    __future__模块
  • 原文地址:https://www.cnblogs.com/zizaisuixin/p/2604850.html
Copyright © 2011-2022 走看看