当前位置： 移动技术网 > IT编程>开发语言>JavaScript > JSTL标签显示分页的代码实例教程

JSTL标签显示分页的代码实例教程

2018年10月05日  | 移动技术网IT编程  | 我要评论

jstl显示分页

页面表格的分页显示，通过jstl标签实现

页面效果

这里写图片描述

代码如下

// 分页显示
<p class="table-pagination tablepagestyle <c:if test='${simple ne false}'> row-fluid tool ui-toolbar</c:if>">
    <p class="pagination tablepagecontentstyle">
        <ul>
            <c:choose>
                <c:when test="${page.firstpage}">
                    <li class="disabled">                           
                        <a class="apagestyle" title="第一页"
                           onclick="$.table.skippage('${page.totalcount}','${pagesize}', 1, this);">
                            <p class="imgpagedivstyle">
                                <img src="${ctx}/static/pageicon/start-page.png" class="imagepagestyle">
                            </p>
                        </a>
                    </li>
                    <li class="disabled">                         
                        <a class="apagestyle" title="上一页"
                           onclick="$.table.skippage('${page.totalcount}','${pagesize}', ${current - 1}, this);">
                            <p class="imgpagedivstyle">
                                <img src="${ctx}/static/pageicon/up-page.png" class="imagepagestyle">
                            </p>
                        </a>
                    </li>
                </c:when>
                <c:otherwise>
                    <li>
                        <a class="apagestyle" title="第一页"
                           onclick="$.table.skippage('${page.totalcount}','${pagesize}', 1, this);">
                            <p class="imgpagedivstyle">
                                <img src="${ctx}/static/pageicon/start-page.png" class="imagepagestyle">
                            </p>
                        </a>
                    </li>
                    <li>                          
                        <a class="apagestyle" title="上一页"
                           onclick="$.table.skippage('${page.totalcount}','${pagesize}', ${current - 1}, this);">
                            <p class="imgpagedivstyle">
                                <img src="${ctx}/static/pageicon/up-page.png" class="imagepagestyle">
                            </p>
                        </a>
                    </li>
                </c:otherwise>
            </c:choose>

            <p class="digongdivstyle">
                <span class="page-input dispanstyle">
                    第&nbsp;<input type="text" class="input-mini inputpagestyle" value="${current}"
                                  onblur="$.table.skippage('${page.totalcount}','${pagesize}', $(this).val(), this);"/> &nbsp;页，
                </span>
                <span class="page-info gongspanstyle">共&nbsp;${page.totalpages}&nbsp;页</span>
            </p>

            <c:choose>
                <c:when test="${page.lastpage}">
                    <li class="disabled">
                        <a class="apagestyle" title="下一页"
                           onclick="$.table.skippage('${page.totalcount}','${pagesize}', ${current + 1}, this);">
                            <p class="imgpagedivstyle">
                                <img src="${ctx}/static/pageicon/down-page.png" class="imagepagestyle">
                            </p>
                        </a>
                    </li>
                    <li class="disabled">
                        <a class="apagestyle" title="最后页"
                           onclick="$.table.skippage('${page.totalcount}','${pagesize}', ${page.totalpages}, this);">
                            <p class="imgpagedivstyle">
                                <img src="${ctx}/static/pageicon/end-page.png" class="imagepagestyle">
                            </p>
                        </a>
                    </li>
                    <li class="disabled">
                        <a class="apagestyle" title="刷新"
                           onclick="$.table.skippage('${page.totalcount}','${pagesize}', ${current}, this);">
                            <p class="imgpagedivstyle refresh-page-button">
                                <img src="${ctx}/static/pageicon/refresh-page.png" class="imagepagestyle refresh-page-button-img">
                            </p>
                        </a>
                    </li>
                </c:when>
                <c:otherwise>
                    <li>
                        <a class="apagestyle" title="下一页"
                           onclick="$.table.skippage('${page.totalcount}','${pagesize}', ${current + 1}, this);">
                            <p class="imgpagedivstyle">
                                <img src="${ctx}/static/pageicon/down-page.png" class="imagepagestyle">
                            </p>
                        </a>
                    </li>
                    <li>
                        <a class="apagestyle" title="最后页"
                           onclick="$.table.skippage('${page.totalcount}','${pagesize}', ${page.totalpages}, this);">
                            <p class="imgpagedivstyle">
                                <img src="${ctx}/static/pageicon/down-page.png" class="imagepagestyle">
                            </p>
                        </a>
                    </li>
                    <li >
                        <a class="apagestyle" title="刷新"
                           onclick="$.table.skippage('${page.totalcount}','${pagesize}', ${current}, this);">
                            <p class="imgpagedivstyle refresh-page-button">
                                <img src="${ctx}/static/pageicon/refresh-page.png" class="imagepagestyle refresh-page-button-img">
                            </p>
                        </a>
                    </li>
                </c:otherwise>
            </c:choose>
        </ul>

        <p class="xiangongdivstyle">
            <c:choose>
                <c:when test="${current==1}">
                    <c:choose>
                        <c:when test="${page.totalcount==0}">
                            <span class="page-info xianshispanstyle">显示&nbsp;${page.totalcount}&nbsp;条,</span>
                        </c:when>
                        <c:otherwise>
                            <c:if test="${page.totalcount<page.pagesize}">
                                <span class="page-info xianshispanstyle">显示&nbsp;1&nbsp;-&nbsp;${page.totalcount}&nbsp;条,</span>
                            </c:if>
                            <c:if test="${page.totalcount>page.pagesize}">
                                <span class="page-info xianshispanstyle">显示&nbsp;1&nbsp;-&nbsp;${page.pagesize}&nbsp;条,</span>
                            </c:if>
                        </c:otherwise>
                    </c:choose>
                </c:when>
                <c:otherwise>
                    <c:if test="${(page.totalcount - page.pagesize * (current - 1)) >= page.pagesize}">
                        <span class="page-info xianshispanstyle">显示&nbsp;${page.pagesize*(current-1)+1}&nbsp;-&nbsp;${page.pagesize*current}&nbsp;条,</span>
                    </c:if>
                    <c:if test="${(page.totalcount - page.pagesize * (current - 1)) < page.pagesize}">
                        <span class="page-info xianshispanstyle">显示&nbsp;${page.pagesize*(current-1)+1}&nbsp;-&nbsp;${page.totalcount}&nbsp;条,</span>
                    </c:if>
                </c:otherwise>
            </c:choose>
            <span class="page-info xiangongspanstyle">共&nbsp;${page.totalcount}&nbsp;条</span>
        </p>
    </p>
</p>

您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网