zoukankan html css js c++ java

java ssm框架实现分页功能（oracle）

java web 实现分页功能

使用框架：ssm

数据库：oracle

话说 oracle 的分页查询比 mysql 复杂多了，在这里简单谈一下：

查询前十条数据：

 1 SELECT * FROM(
 2        SELECT ROWNUM WN,RN.* FROM (
 3             SELECT
 4                   id,
 5                   title,
 6                   create_time as createTime,
 7                   musictor,
 8                   musictitle
 9              FROM
10                  krry_blog
11              ORDER BY create_time desc
12          )RN
13     )WN
14 WHERE WN <= 10 AND WN > 0

oracle 分页查询语法较为复杂，

同样的结果，mysql 的语法是：用一个 LIMIT 就可以解决。

LIMIT a,b ：参数 a：第 a 条数据开始查询（不包括第 a 条），参数 b：查询 b 条数据

 1 SELECT
 2     id,
 3     title,
 4     create_time as createTime,
 5     musictor,
 6     musictitle
 7 FROM
 8     krry_blog
 9     ORDER BY create_time desc
10 LIMIT 5,3

查询的是从结果集中第5条数据开始的3条数据（即查询出第6、第7、第8条数据）

SSM 框架的搭建，就不多说了，以前的博客有详细介绍，这里就谈谈实现 java web 分页的功能。

用到插件 js ： krry_page.js，还有jQuery

mapper 持久层：

BlogMapper.java

 1 package com.krry.mapper;
 2 
 3 import java.util.HashMap;
 4 import java.util.List;
 5 import com.krry.entity.Params;
 6 
 7 /**
 8  * 
 9  * Mapper：操作数据库
10  * @author krry
11  * @version 1.0.0
12  *
13  */
14 public interface BlogMapper {
15 
16     /**
17      * 查询所有博客
18      * @param params
19      * @return
20      */
21     public List<HashMap<String, Object>> findBlogs(Params params);
22     
23     /**
24      * 计算博客数量
25      * com.krry.dao.admin 
26      * 方法名：countBlogs
27      * @author krry 
28      * @param params
29      * @return int
30      * @exception 
31      * @since  1.0.0
32      */
33     public long countBlogs();
34     
35     
36 }

BlogMapper.xml

 1 <?xml version="1.0" encoding="UTF-8" ?>
 2 <!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
 3 "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
 4 
 5 <mapper namespace="com.krry.mapper.BlogMapper" >
 6     
 7     <!-- 分页查询所有的博客信息 -->
 8     <select id="findBlogs" resultType="java.util.HashMap" parameterType="Params">
 9         SELECT * FROM(
10             SELECT ROWNUM WN,RN.* FROM (
11                 SELECT
12                     id,
13                     title,
14                     create_time as createTime,
15                     musictor,
16                     musictitle
17                 FROM
18                     krry_blog
19                 ORDER BY create_time desc
20             )RN
21         )WN
22         WHERE WN &lt;= #{pageSize} AND WN &gt; #{pageNo}
23     </select>
24     
25     <!-- 查询博客数量 -->
26     <select id="countBlogs" resultType="long">
27         SELECT
28             count(*)
29         FROM
30             krry_blog
31     </select>
32     
33     
34 </mapper>

service业务层：

接口类：IBlogService.java

 1 package com.krry.service;
 2 
 3 import java.util.HashMap;
 4 import java.util.List;
 5 
 6 import javax.servlet.http.HttpServletRequest;
 7 
 8 import org.apache.ibatis.annotations.Param;
 9 
10 import com.krry.entity.Blog;
11 import com.krry.entity.Params;
12 
13 /**
14  * service层：处理业务逻辑（impl里面实现）
15  * @author asusaad
16  *
17  */
18 public interface IBlogService {
19     
20     /**
21      * 分页查询所有博客
22      * @param params
23      * @return
24      */
25     public List<HashMap<String, Object>> findBlogs(Params params);
26     
27     /**
28      * 计算博客数量
29      * @param params
30      * @return
31      */
32     public long countBlogs();
33     
34 }

impl 实现类：BlogService.java

 1 package com.krry.service.impl;
 2 
 3 import java.util.HashMap;
 4 import java.util.List;
 5 
 6 import org.springframework.beans.factory.annotation.Autowired;
 7 import org.springframework.stereotype.Service;
 8 import org.springframework.web.servlet.ModelAndView;
 9 
10 import com.krry.entity.Params;
11 import com.krry.mapper.BlogMapper;
12 import com.krry.service.IBlogService;
13 
14 /**
15  * 实现service层接口
16  * @author asusaad
17  *
18  */
19 @Service
20 public class BlogService implements IBlogService{
21 
22     @Autowired
23     private BlogMapper blogMapper;
24     
25     /**
26      * 查询博客
27      */
28     public List<HashMap<String, Object>> findBlogs(Params params) {
29         
30         //查询博客信息
31         List<HashMap<String, Object>> blog = blogMapper.findBlogs(params);
32         
33         
34         return blog;
35     }
36     
37     /**
38      * 计算博客数量
39      * @param params
40      * @return
41      */
42     public long countBlogs(){
43         
44         long coutBlogs = blogMapper.countBlogs();
45         
46         return coutBlogs;
47     }
48     
49     
50 
51 }

controller控制层：

KrryController.java

 1 package com.krry.controller;
 2 
 3 import java.util.HashMap;
 4 import java.util.List;
 5 
 6 import org.springframework.beans.factory.annotation.Autowired;
 7 import org.springframework.stereotype.Controller;
 8 import org.springframework.web.bind.annotation.RequestMapping;
 9 import org.springframework.web.bind.annotation.ResponseBody;
10 import org.springframework.web.servlet.ModelAndView;
11 import com.krry.entity.Params;
12 import com.krry.service.IBlogService;
13 
14 /**
15  * KrryController
16  * controller层，作为请求转发
17  * @author asusaad
18  *
19  */
20 @Controller  //表示是多例模式，每个用户返回的web层是不一样的
21 public class KrryController {
22     
23     @Autowired
24     private IBlogService blogService;
25     
26     /**
27      * 首页，并且分页查询
28      * @return
29      */
30     @RequestMapping("/index")
31     public ModelAndView index(Params params){
32         
33         params.setPageNo(0);
34         params.setPageSize(10); //一开始只查询10条
35         
36         //调用业务层
37         List<HashMap<String, Object>> blogs = blogService.findBlogs(params);
38         //查询博客数量
39         long coutBlogs = blogService.countBlogs();
40         
41         ModelAndView modelAndView = new ModelAndView();
42         modelAndView.addObject("blogs", blogs);
43         modelAndView.addObject("coutBlogs", coutBlogs);
44         modelAndView.setViewName("index");
45         
46         return modelAndView;
47     }
48     
49     /**
50      * ajax请求 的 分页查询
51      * @param params
52      * @return
53      */
54     @ResponseBody
55     @RequestMapping("/loadData")
56     public HashMap<String, Object> loadData(Params params){
57         
58         HashMap<String, Object> map = new HashMap<String, Object>();
59         List<HashMap<String, Object>> blogs = blogService.findBlogs(params);
60         map.put("blogs", blogs);
61         
62         return map;
63     }
64     
65 }

这里要有两个实体类，作为数据库查询的注入 Blog，还有分页查询的两个参数 Params：

设置data参数：pageNo（下一页）：就是当前页数 * 下一页要显示的数量
　　　　　　 pageSize（下一页）：已经查询出来的数量（pageNo） + 每页要显示的数量
在数据库中是 WN <= pageSize and WN > pageNo 来查询分页数据

Blog.java

 1 package com.krry.entity;
 2 
 3 
 4 /**
 5  * 
 6  * User
 7  * @author krry
 8  * @version 1.0.0
 9  *
10  */
11 public class Blog {
12 
13     // 主键
14     private String id;
15     //博客标题
16     private String title;
17     //音乐作者
18     private String musictor;
19     //音乐标题
20     private String musictitle;
21     //创建时间
22     private String createTime;
23      
24     public Blog(String id, String title, String musictor, String musictitle,
25             String createTime) {
26         this.id = id;
27         this.title = title;
28         this.musictor = musictor;
29         this.musictitle = musictitle;
30         this.createTime = createTime;
31     }
32 
33     public String getId() {
34         return id;
35     }
36 
37     public void setId(String id) {
38         this.id = id;
39     }
40 
41     public String getTitle() {
42         return title;
43     }
44 
45     public void setTitle(String title) {
46         this.title = title;
47     }
48 
49     public String getMusictor() {
50         return musictor;
51     }
52 
53     public void setMusictor(String musictor) {
54         this.musictor = musictor;
55     }
56 
57     public String getMusictitle() {
58         return musictitle;
59     }
60 
61     public void setMusictitle(String musictitle) {
62         this.musictitle = musictitle;
63     }
64 
65     public String getCreateTime() {
66         return createTime;
67     }
68 
69     public void setCreateTime(String createTime) {
70         this.createTime = createTime;
71     }
72      
73      
74 }

Params.java

 1 package com.krry.entity;
 2 
 3 /**
 4  * 
 5  * Params
 6  * @author krry
 7  * @version 1.0.0
 8  *
 9  */
10 public class Params {
11 
12     private Integer pageSize = 0;
13     private Integer pageNo = 0;
14     
15 
16     public Integer getPageNo() {
17         return pageNo;
18     }
19 
20     public void setPageNo(Integer pageNo) {
21         this.pageNo = pageNo;
22     }
23     
24     public Integer getPageSize() {
25         return pageSize;
26     }
27 
28     public void setPageSize(Integer pageSize) {
29         this.pageSize = pageSize;
30     }
31 
32 }

web 页面 index.jsp

  1 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
  2 <%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
  3 <%
  4 String path = request.getContextPath();
  5 String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
  6 pageContext.setAttribute("basePath", basePath);
  7 %>
  8 
  9 <!DOCTYPE HTML>
 10 <html>
 11   <head>
 12     <title>分页</title>
 13     <style>
 14         body{background:url("resource/images/78788.jpg");background-size:cover;}
 15         .titless{font-size: 34px;text-align: center;color: black;margin-bottom: 16px;}
 16         .ke_tabbox{min-height:556px;width:900px;background:#f9f9f9;margin:20px auto 0;padding:6px;position:relative;}
 17             .ke_tabbox .sendMy{text-align: center;
 18                     font-family: "微软雅黑";
 19                     font-size: 28px;
 20                     -webkit-text-fill-color: transparent;
 21                     background: -webkit-gradient(linear,left top,left bottom,from(#FD8700),to(#FF00B1));
 22                     -webkit-background-clip: text;
 23                     margin:8px auto 0;line-height: 35px;}
 24             .ke_tabbox .ke_table{width:100%;margin-top: 26px;}
 25             .ke_tabbox  th{background:#ccc;font-weight:bold;}
 26             .ke_tabbox .ke_table td,th{overflow: hidden;white-space: nowrap;text-overflow: ellipsis;border:1px solid #fff;padding:4px 12px;color:#666;font-size:12px;}
 27             /*分页相关*/
 28             .tzPage{font-size: 12px;position: absolute;top: 480px;right: 0px;}
 29             
 30             #tbody tr:hover{background:#eaeaea;}
 31             #tbody .t_mode{padding-right:4px;}
 32             #tbody .t_avbiaoq:hover{color:#FF6857;transition:.4s}
 33             #tbody .t_dele{padding-left:4px;}
 34     
 35             .tzPage a{text-decoration:none;border:none;color:#7d7d7d;background-color:#f2f2f2;border-radius: 3px;}
 36             .tzPage a:hover{background:#dd5862;color:#FFF;}
 37             .tzPage a,.tzPage span{display:block;float:left;padding:0em 0.5em;margin-right:5px;margin-bottom:5px;min-width:1em;text-align:center;line-height: 22px;height: 22px;}
 38             .tzPage .current{background:#dd5862;color:#FFF;border:none;border-radius: 3px;}
 39             .tzPage .current.prev,.tzPage .current.next{color:#999;border:1px solid #e5e5e5;background:#fff;}
 40             .tm_psize_go{margin-right:4px;float:left;height:24px;line-height:33px;position:relative;border:1px solid #e5e5e5;color:#999}
 41             #tm_pagego{border-radius:3px;height:18px;width:30px;float:left;text-align:center;border:1px solid #e5e5e5;line-height: 22px;color:#999}
 42             .sortdesc{border-top:5px solid;width:0px;height:0px;display:inline-block;vertical-align:middle;border-right:5px solid transparent;border-left:5px solid transparent;margin-left:5px;}
 43             .sortasc{border-bottom:5px solid;width:0px;height:0px;display:inline-block;vertical-align:middle;border-right:5px solid transparent;border-left:5px solid transparent;margin-left:5px;}
 44             .red{color:red}    
 45             .green{color:green}
 46             
 47             .hideAdd{height: 300px;
 48                     text-align: center;
 49                     line-height: 300px;
 50                     margin-top: 16px;display:none;}
 51             .hideAdd a{font-size:28px;-webkit-text-fill-color:transparent;background: -webkit-gradient(linear,left top,left bottom,from(#FD0051),to(#A22C93));-webkit-background-clip: text;}
 52     </style>
 53   </head>
 54   
 55   <body>
 56       <div class="ke_tabbox">
 57           <p class="titless">分页展示</p>
 58         <table class="ke_table">
 59             <thead>
 60                 <tr>
 61                     <th style="25%">标题</th>
 62                     <th style="25%">音乐人</th>
 63                     <th style="30%">音乐标题</th>
 64                     <th style="20%">发布时间</th>
 65                 </tr>
 66             </thead>
 67             
 68             <tbody id="tbody" data-itemcount="${coutBlogs}">
 69                 <c:forEach var="blog" items="${blogs}">
 70                     <tr>
 71                         <td><a class="t_avbiaoq" title="${blog.TITLE}">${blog.TITLE}</a></td>
 72                         <td><a class="t_avbiaoq" title="${blog.MUSICTOR}">${blog.MUSICTOR}</a></td>
 73                         <td><a class="t_avbiaoq" title="${blog.MUSICTITLE}">${blog.MUSICTITLE}</a></td>
 74                         <td>${blog.CREATETIME}</td>
 75                     </tr>
 76                 </c:forEach>
 77             </tbody>
 78         </table>
 79         <div id="krryPage"></div>
 80     </div>
 81     <script type="text/javascript" src="${basePath}/resource/js/jquery-1.11.3.min.js"></script>
 82     <script type="text/javascript" src="${basePath}/resource/js/krry_page.js"></script>
 83     <script type="text/javascript">var basePath = "${basePath}";</script>
 84     <script type="text/javascript">
 85         
 86         var krryAdminBlog = {
 87             initPage:function(itemCount){
 88                 $("#krryPage").tzPage(itemCount, {
 89                     num_display_entries : 5, //主体页数
 90                     num_edge_entries : 4,//边缘页数
 91                     current_page : 0,//指明选中页码
 92                     items_per_page : 10, //每页显示多少条
 93                     prev_text : "上一页",
 94                     next_text : "下一页",
 95                     showGo:true,//显示
 96                     showSelect:false,
 97                     callback : function(pageNo, psize) {//会回传两个参数，第一个是当前页数，第二个是每页要显示的数量
 98                         krryAdminBlog.loadData(pageNo,psize);
 99                     }
100                 });
101             },
102             //设置data参数：pageNo（下一页）：就是当前页数 * 下一页要显示的数量
103             //            pageSize（下一页）：已经查询出来的数量（pageNo）  + 每页要显示的数量
104             //在数据库中是  WN <= pageSize and WN > pageNo 来查询分页数据
105             loadData:function(pageNo,pageSize){
106                 pageNo = pageNo * pageSize;
107                 pageSize = pageNo + 10;
108                 $.ajax({
109                     type:"post",
110                     url:basePath+"/loadData",
111                     data:{pageNo:pageNo,pageSize:pageSize},
112                     success:function(data){
113                         if(data){
114                             var html = "";
115                             var blogArr = data.blogs;
116                             for(var i=0,len=blogArr.length;i < len;i++){
117                                 var json = blogArr[i];
118                                 html+= "<tr>"+
119                                 "    <td><a class='t_avbiaoq' title='"+json.TITLE+"'>"+json.TITLE+"</a></td>"+
120                                 "    <td><a class='t_avbiaoq' title='"+json.NAME+"'>"+json.MUSICTOR+"</a></td>"+
121                                 "    <td><a class='t_avbiaoq' title='"+json.MUSICTITLE+"'>"+json.MUSICTITLE+"</a></td>"+
122                                 "    <td>"+json.CREATETIME+"</td>"+
123                                 "</tr>";
124                             }
125                             $("#tbody").html(html);
126                         }
127                     }
128                 });
129             }
130         };
131         
132         krryAdminBlog.initPage($("#tbody").data("itemcount"));
133         
134     </script>
135   </body>
136 </html>

分页效果图：

java ssm框架实现分页功能 （oracle）