zoukankan      html  css  js  c++  java
  • 前端分页处理

    function createPageText(pageInfo) {
        var $ul = $("<ul/>").addClass("pagination");
        //首页
        if (pageInfo.isFirstPage) {
            var $a = $("<a/>").text("首页").prop("href", "javascript:void(0);").addClass("lastNone");
            var $firstLi = $("<li/>");
            $firstLi.append($a);
            $ul.append($firstLi);
        } else {
            var $a = $("<a onclick='loadPage(1)'>首页</a>").prop("href", "javascript:void(0);");
            var $firstLi = $("<li/>").addClass("first");
            $firstLi.append($a);
            $ul.append($firstLi);
        }
    
        //上一页
        //如果当前页为1,那么上一页还是1
        var $prevLi = null;
        if (!pageInfo.hasPreviousPage) {
            var $a = $("<a>上一页</a>").prop("href", "javascript:void(0);").addClass("lastNone");
            ;
            var $prevLi = $("<li/>");
            $prevLi.append($a);
        } else {
            var $a = $("<a onclick='loadPage(" + pageInfo.prePage + ")'>上一页</a>").prop("href", "javascript:void(0);");
            var $prevLi = $("<li/>").addClass("prev");
            $prevLi.append($a);
        }
        $ul.append($prevLi);
        //循环迭代中间分页部分
        $.each(pageInfo.navigatepageNums, function (i, n) {
            if (pageInfo.pageNum == n) {
                /*console.log("当前页面" + n);*/
                var $currentLi = $("<li/>").addClass("page active");
                var $a = $("<a onclick='loadPage(" + n + ")'>" + n + "</a>").addClass("current").prop("href", "javascript:void(0);");
                $currentLi.append($a);
                $ul.append($currentLi);
            } else {
                var $currentLi = $("<li/>").addClass("page");
                var $a = $("<a onclick='loadPage(" + n + ")'>" + n + "</a>").prop("href", "javascript:void(0);");
                $currentLi.append($a);
                $ul.append($currentLi);
            }
        });
        //下一页
        var $nextLi = null;
        if (!pageInfo.hasNextPage) {
            var $a = $("<a>下一页</a>").prop("href", "javascript:void(0);").addClass("lastNone");
            var $prevLi = $("<li/>");
            var $nextLi = $prevLi.append($a);
            $ul.append($nextLi);
        } else {
            var $a = $("<a onclick='loadPage(" + pageInfo.nextPage + ")'>下一页</a>").prop("href", "javascript:void(0);");
            var $prevLi = $("<li/>").addClass("prev");
            var $nextLi = $prevLi.append($a);
            $ul.append($nextLi);
        }
    
        //末页
        if (pageInfo.isLastPage) {
            var $a = $("<a>末页</a>").prop("href", "javascript:void(0);").addClass("lastNone");
            var $lastLi = $("<li/>");
            $lastLi.append($a);
            $ul.append($lastLi);
        } else {
            if (pageInfo.pages == 0) {
                var $a = $("<a>末页</a>").prop("href", "javascript:void(0);").addClass("lastNone");
                var $lastLi = $("<li/>").addClass("last");
                $lastLi.append($a);
                $ul.append($lastLi);
            } else {
                var $a = $("<a onclick='loadPage(" + pageInfo.pages + ")'>末页</a>").prop("href", "javascript:void(0);");
                var $lastLi = $("<li/>").addClass("last");
                $lastLi.append($a);
                $ul.append($lastLi);
            }
    
        }
        //总页数
        var $cntLi = $("<li/>");
        $cntLi.append($("<span/>").addClass("cnt").html("共 <i style='color:#ff6600;'>" + pageInfo.pages + "</i>页"));
        $ul.append($cntLi);
        //总记录数
        var $numLi = $("<li/>");
        $numLi.append($("<span/>").html("<i style='color:#ff6600;'>" + pageInfo.total + "</i>条记录")).addClass("num");
        $ul.append($numLi);
        $("#div_pagination").empty().append($ul);
    }
  • 相关阅读:
    基于DM642 RAW采集格式的视频驱动开发及应用
    嵌入式开发之davinci--- 8148/8168/8127 中的添加算饭scd 场景检测 代码实现
    如何在外部采用AES-128对HLS的TS流进行加密
    阶段3 2.Spring_03.Spring的 IOC 和 DI_11 set方法注入
    阶段3 2.Spring_03.Spring的 IOC 和 DI_10 构造函数注入
    阶段3 2.Spring_03.Spring的 IOC 和 DI_9 spring的依赖注入
    阶段3 2.Spring_03.Spring的 IOC 和 DI_8 spring中bean的细节之生命周期
    阶段3 2.Spring_03.Spring的 IOC 和 DI_7 spring中bean的细节之作用范围
    阶段3 2.Spring_03.Spring的 IOC 和 DI_6 spring中bean的细节之三种创建Bean对象的方式
    阶段3 2.Spring_03.Spring的 IOC 和 DI_5 BeanFactory和ApplicationContext的区别
  • 原文地址:https://www.cnblogs.com/zsongs/p/8193162.html
Copyright © 2011-2022 走看看