PageHelper+FreeMarker分页模板

蔚落 2021-12-01 12:18 323阅读 0赞

<ul id="_page" class="pagination">
        <#--    是否显示上一页-->
        <#--    定义当前页-->
        <#assign c=p.pageNum>
        <#assign t=p.pages>
        <#assign length=t-c>
        <#if c gt 1>
            <li οnclick="_page(${c},'d')">
                <a href="#"><</a>
            </li>
        </#if>
        <#if c gt 4>
            <li>
                <a href="#" οnclick="_page('1','t')">1</a>
            </li>
            <li>
                <a href="#">…</a>
            </li>
        </#if>
        
        <#if t gt 5>
            <#if c gte 3>
                <#if length gt 2>
                    
                    <#list c-2..c+2 as mt>
                        <#if mt=c>
                        <#--                        高亮当前页-->
                            <li class="active">
                                <a href="#">${mt}</a>
                            </li>
                        <#else>
                            <li οnclick="_page('${mt}','t')">
                                <a href="#">${mt}</a>
                            </li>
                        </#if>
                    </#list>
                <#else>
                    <#list c-3..t as mt>
                        <#if mt=c>
                        <#--                        高亮当前页-->
                            <li class="active">
                                <a href="#">${mt}</a>
                            </li>
                        <#else>
                            <li οnclick="_page('${mt}','t')">
                                <a href="#">${mt}</a>
                            </li>
                        </#if>
                    </#list>
                </#if>
            <#else>
                <#list 1..5 as mt>
                    <#if mt=c>
                    <#--                        高亮当前页-->
                        <li class="active">
                            <a href="#">${mt}</a>
                        </li>
                    <#else>
                        <li οnclick="_page('${mt}','t')">
                            <a href="#">${mt}</a>
                        </li>
                    </#if>
                </#list>
            </#if>
        <#else>
            <#list 1..t as mt>
                <#if mt=c>
                <#--                        高亮当前页-->
                    <li class="active">
                        <a href="#">${mt}</a>
                    </li>
                <#else>
                    <li οnclick="_page('${mt}','t')">
                        <a href="#">${mt}</a>
                    </li>
                </#if>
            </#list>
        </#if>
        
        <#if length gt 2 && t gt 5>
            <li>
                <a href="#">…</a>
            </li>
            <li>
                <a href="#" οnclick="_page(${t},'t')">${t}</a>
            </li>
        </#if>
        <#if c lt t>
            <li οnclick="_page(${c},'u')">
                <a href="#">></a>
            </li>
        </#if>
        <#if t gt 5>
            <li style="display: inline-block;float: left">
                <input type="text" id="skipInput" name="skipInput" id="skipInput"/>
    
            </li>
            <li οnclick="{
               var _pageTo = $('input[name=skipInput]').val();
               _page(_pageTo,'t');
            }">
                <a href="#">GO</a>
            </li>
        </#if>
    </ul>
    <style>
        #_page li {
            padding-top: 10px;
            height: 40px;
            width: 40px;
            text-align: center;
            border: 1px solid #e2e2e2;
            border-radius: 3px;
            margin-right: 5px;
            cursor: pointer;
        }
    
        #_page .active {
            background: #4680ff;
        }
        #skipInput{
            width: 20px;
            height: 20px;
            border: hidden;
            background: #f8f9fa;
        }
        #_page{
            position: relative; left: -30%;
        }
    
    </style>