zoukankan      html  css  js  c++  java
  • jsp前端实现分页代码

    前端需要订一page类包装,其参数为

    private Integer pageSize=10; //每页记录条数=10

    private Integer totalCount; //总记录条数

    private Integer totalPage; //总页数

    private Integer currPage; //当前页

    private Integer startIndex; //开始索引

    private List<M> list; //结果集

    进行查询的数据set进对象,在运用ModelAndView对象

    ModelAndView .addObject("page",page);

    将page返回前台jsp,接受成功之后在其他页面直接引用jsp标签<jsp:include page="/page.jsp" />就可以调用

    以下为jsp页面代码:

    <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
    <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
    <!-- 最下面显示跳转页面 -->
    <!-- ${page.totalCount }总的记录条数  其他的类似,与Page.java相关联 -->
    <div >
    	
    	共 <i class="blue">${page.totalCount }</i> 
    	条记录,当前显示第 <i class="blue">${page.currPage }
    	</i> 页 / 共 <i class="blue">${page.totalPage }</i> 页
    	    跳转  
    	<input type="text" class="scinput" 
    	style=" 40px;height: 20px" id="currPage2" onblur="page2()" 
    	onkeyup="this.value=this.value.replace(/D/g,'')"
    	onafterpaste="this.value=this.value.replace(/D/g,'')" />  页
    	
         <!-- 首页按钮,跳转到首页 -->
        <p>  <c:if test="${page.currPage <= 1 }"></c:if> 
        <a href="javascript:;" <c:if test="${page.currPage > 1 }">onclick="page1(1)"</c:if> >首页</a>
        
        
        <!-- 上页按钮,跳转到上一页 -->
        <c:if test="${page.currPage <= 1 }"></c:if> 
        <a href="javascript:;" <c:if test="${page.currPage > 1 }">onclick="page1('${page.currPage - 1}')"</c:if> >上页</a>
        
        <!-- 下页按钮,跳转到下一页 -->
         <c:if test="${page.currPage >= page.totalPage }"></c:if> 
        <a href="javascript:;" <c:if test="${page.currPage < page.totalPage }">onclick="page1('${page.currPage + 1}')"</c:if> >下页</a>
        
        <!-- 末页按钮,跳转到最后一页 -->
         <c:if test="${page.currPage >= page.totalPage }"></c:if> 
        <a href="javascript:;" <c:if test="${page.currPage < page.totalPage }">onclick="page1('${page.totalPage}')"</c:if> >末页</a>
        </p>
        </div>
  • 相关阅读:
    【腾讯敏捷转型NO.1】敏捷是什么鬼?
    【敏捷实用工具】JIRA介绍以及使用方法
    SpringCloud学习总结(三)——案例环境搭建
    SpringCloud学习总结(二)——SpringCloud微服务概述
    SpringCloud学习总结(一)——微服务基础知识
    IDEA jrebel 破解
    IDEA的几个常用配置,日常开发必备。
    java中实体类的区别
    zookeeper 学习总结(四)——基本使用
    zookeeper 学习总结(三)——linux上部署单机以及集群
  • 原文地址:https://www.cnblogs.com/tfl-511/p/6255191.html
Copyright © 2011-2022 走看看