SSM-CRUD入门项目——查询
查询
1.基础查询
分析：访问项目主页 index.jsp 时应该跳转到列表页
我们可以在index.jsp发出查询员工列表请求，来到 list.jsp
使用插件 pageHelper 完成分页功能——使用pageHelper，给他需要的参数：我要查询第几页，每页几条记录，我要连续显示几条？
首先在首页页面直接转发：
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<<jsp:forward page="/emps"></jsp:forward>
<!-- <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<link href="static/bootstrap/css/bootstrap.min.css" rel="stylesheet">
先引入jQuery，再引入js
<script type="text/javascript" src="static/bootstrap/js/jquery.min.js"> </script>
<script src="static/bootstrap/js/bootstrap.min.js"></script>
</head>
<body> </body>
</html> -->
编写一下转发的controller：
package cn.crud.controller; import java.util.List; import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam; import com.github.pagehelper.PageHelper;
import com.github.pagehelper.PageInfo; import cn.crud.bean.Employee;
import cn.crud.service.EmpService; /**
* 处理员工的CRUD请求
* @author Administrator
*
*/
@Controller
public class EmpController { @Autowired
private EmpService empService;
/**
* 分页查询员工数据
* @return
*/
@RequestMapping("/emps")
public String getEmps(@RequestParam(value="pn",defaultValue="1") Integer pn, Model model){
//改造为一个分页查询
//在查询之前传入分页参数：起始页和每页记录数
PageHelper.startPage(pn, 5);
//后面紧跟的查询就是分页查询
List<Employee> empList = empService.getAll();
//用PageInfo对结果进行包装，只需要将PageInfo交给页面即可，这里面封装了详细的信息,第二个参数为需要连续显示的记录数
PageInfo page = new PageInfo(empList,5);
model.addAttribute("page", page);
return "list";
}
}
//分页插件pageHelper的使用以及引入等可以参照官方文档等，这里暂时不展开，待另外博客更新
由于controller中调用service,我们生成service：
package cn.crud.service; import java.util.List; import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service; import cn.crud.bean.Employee;
import cn.crud.dao.EmployeeMapper; @Service
public class EmpService { @Autowired
private EmployeeMapper employeeMapper; public List<Employee> getAll() {
/**
* 没有查询条件的查询所有，带部门信息
*/
return employeeMapper.selectByExampleWithDept(null);
} }
//service中调用dao的mapper:
在来到页面之前，我们先使用spring的单元测试进行测试，测试数据是否正常到达：
package cn.crud.tests; import java.util.List; import org.junit.Before;
import org.junit.Test;
import org.junit.runner.RunWith;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.test.context.ContextConfiguration;
import org.springframework.test.context.junit4.SpringJUnit4ClassRunner;
import org.springframework.test.context.web.WebAppConfiguration;
import org.springframework.test.web.servlet.MockMvc;
import org.springframework.test.web.servlet.MvcResult;
import org.springframework.test.web.servlet.request.MockMvcRequestBuilders;
import org.springframework.test.web.servlet.setup.MockMvcBuilders;
import org.springframework.web.context.WebApplicationContext; import com.github.pagehelper.PageInfo; import cn.crud.bean.Employee; /**
* 使用spring的单元测试来进行模拟发送请求的测试
* @author Administrator
*
*/
@RunWith(SpringJUnit4ClassRunner.class)
@WebAppConfiguration
@ContextConfiguration(locations={"classpath:applicationContext.xml",
"file:src/main/webapp/WEB-INF/dispatcherServlet-servlet.xml"})
public class MVCTest { //springMVC的IOC容器
@Autowired
private WebApplicationContext context;
//模拟MVC请求
private MockMvc mockMvc; @Before
public void setup(){
mockMvc = MockMvcBuilders.webAppContextSetup(context).build();
} @Test
public void testPage() throws Exception{
//模拟请求拿到返回值
MvcResult result = mockMvc.perform(MockMvcRequestBuilders.get("/emps").param("pn", "2"))
.andReturn();
//请求域中有pageInfo
PageInfo page = (PageInfo) result.getRequest().getAttribute("page");
System.out.println(page.getPageNum());
System.out.println(page.getTotal()); //得到员工数据
List<Employee> list = page.getList();
for (Employee employee : list) {
System.out.println("ID:"+employee.getdId()+" 性别:"+employee.getGender());
}
}
}
//尤其需要注意的是spring-test4的版本需要servlet3.0以上的版本，我们去仓库中第一个java servlet-api找到3.1的版本替换原来2.5的版本！
界面的搭建：
使用bootstrap的栅格系统快速搭建简单的界面框架
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>员工列表</title>
<%
pageContext.setAttribute("path",request.getContextPath());
%>
<!-- 推荐以 / 开始的相对路径（以服务器的根路径为相对路径） -->
<link href="${path}/static/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- 先引入jQuery，再引入js -->
<script type="text/javascript" src="${path}/static/bootstrap/js/jquery.min.js"> </script>
<script src="${path}/static/bootstrap/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<!-- 分为四大行 -->
<!-- 标题 -->
<div class="row">
<div class="col-md-12">
<font size="20">SSM-CRUD</font>
</div>
</div>
<!-- 按钮 -->
<div class="row">
<!-- 偏移4列 -->
<div class="col-md-4 col-md-offset-8">
<button type="button" class="btn btn-primary ">新增</button>
<button type="button" class="btn btn-danger ">删除</button>
</div>
</div>
<!-- 表格 -->
<div class="row">
<div class="col-md-12">
<table class="table table-hover">
<tr>
<th>#</th>
<th>empName</th>
<th>empEmail</th>
<th>gender</th>
<th>deptName</th>
<th>操作</th>
</tr>
<tr>
<td>1</td>
<td>aa</td>
<td>123@163.com</td>
<td>M</td>
<td>开发部</td>
<td>
<button type="button" class="btn btn-info btn-sm">
<span class="glyphicon glyphicon-penci" aria-hidden="true"></span>
编辑</button>
<button type="button" class="btn btn-danger btn-sm">
<span class="glyphicon glyphicon-trash" aria-hidden="true"></span>
删除</button>
</td>
</tr>
</table>
</div>
</div>
<!-- 分页信息 -->
<div class="row">
<!-- 分页文字信息 -->
<div class="col-md-6">
当前记录数：xxx
</div>
<!-- 分页条 -->
<div class="col-md-6">
<nav aria-label="Page navigation">
<ul class="pagination">
<li><a href="#">首页</a></li>
<li>
<a href="#" aria-label="Previous">
<span aria-hidden="true">«</span>
</a>
</li>
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
<li>
<a href="#" aria-label="Next">
<span aria-hidden="true">»</span>
</a>
</li>
<li><a href="#">末页</a></li>
</ul>
</nav>
</div>
</div>
</div>
</body>
</html>
//注意不要使用不带 / 的相对路径，而是使用带 / 的路径
使用maven分类博客中使用插件运行Maven项目：访问主页，成功！
接下来利用分页插件完成分页信息的查询，由于我们将分页信息都封装在pageInfo中，我们利用这个完成分页页面的搭建：
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>员工列表</title>
<%
pageContext.setAttribute("path",request.getContextPath());
%>
<!-- 推荐以 / 开始的相对路径（以服务器的根路径为相对路径） -->
<link href="${path}/static/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- 先引入jQuery，再引入js -->
<script type="text/javascript" src="${path}/static/bootstrap/js/jquery.min.js"> </script>
<script src="${path}/static/bootstrap/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<!-- 分为四大行 -->
<!-- 标题 -->
<div class="row">
<div class="col-md-12">
<font size="20">SSM-CRUD</font>
</div>
</div>
<!-- 按钮 -->
<div class="row">
<!-- 偏移4列 -->
<div class="col-md-4 col-md-offset-8">
<button type="button" class="btn btn-primary ">新增</button>
<button type="button" class="btn btn-danger ">删除</button>
</div>
</div>
<!-- 表格 -->
<div class="row">
<div class="col-md-12">
<table class="table table-hover">
<tr>
<th>#</th>
<th>empName</th>
<th>empEmail</th>
<th>gender</th>
<th>deptName</th>
<th>操作</th>
</tr>
<c:forEach items="${pageInfo.list }" var="emp">
<tr>
<td>${emp.empId}</td>
<td>${emp.empName}</td>
<td>${emp.email}</td>
<!-- 三元运算符展示性别信息 -->
<td>${emp.gender=="M"?"男":"女"}</td>
<td>${emp.department.deptName}</td>
<td>
<button type="button" class="btn btn-info btn-sm">
<span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>
编辑</button>
<button type="button" class="btn btn-danger btn-sm">
<span class="glyphicon glyphicon-trash" aria-hidden="true"></span>
删除</button>
</td>
</tr>
</c:forEach>
</table>
</div>
</div>
<!-- 分页信息 -->
<div class="row">
<!-- 分页文字信息，其中分页信息都封装在pageInfo中 -->
<div class="col-md-6">
当前第：${pageInfo.pageNum}页，总共：${pageInfo.pages}页，总共：${pageInfo.total}条记录
</div>
<!-- 分页条 -->
<div class="col-md-6">
<nav aria-label="Page navigation">
<ul class="pagination">
<li><a href="${path}/emps?pn=1">首页</a></li>
<c:if test="${pageInfo.hasPreviousPage }">
<li>
<a href="${path}/emps?pn=${pageInfo.pageNum-1}" aria-label="Previous">
<span aria-hidden="true">«</span>
</a>
</li>
</c:if> <c:forEach items="${pageInfo.navigatepageNums }" var="page_Num">
<c:if test="${page_Num == pageInfo.pageNum }">
<li class="active"><a href="#">${page_Num}</a></li>
</c:if>
<c:if test="${page_Num != pageInfo.pageNum }">
<li><a href="${path}/emps?pn=${page_Num}">${page_Num}</a></li>
</c:if>
</c:forEach>
<c:if test="${pageInfo.hasNextPage }">
<li>
<a href="${path}/emps?pn=${pageInfo.pageNum+1}" aria-label="Next">
<span aria-hidden="true">»</span>
</a>
</li>
</c:if>
<li><a href="${path}/emps?pn=${pageInfo.pages}">末页</a></li>
</ul>
</nav>
</div>
</div>
</div>
</body>
</html>
//注意：
//使用PageHelper.startPage只是针对接下来的一条查询语句，
//如果又查询了一次数据，则还需要使用一次PageHelper.startPage
2.AJAX请求
浏览器的请求是可以正确完成相关的功能的，但是如果是安卓IOS等移动客户端，服务器再发送一个页面给移动设备解析的话，是比较费力的，交互体验也不是很好，于是，我们将请求更改为前台发AJAX请求，后台返回JSON数据
分析：首页index.jsp直接发送ajax请求进行员工分页信息的查询
服务器将查询的数据以JSON格式返回
前台使用js完成JSON的解析，通过DOM操作完成增删改查的操作。
回忆springMVC与JSON的交互，需要jackson的包，我们去中央仓库找到maven的坐标：
我们找到第一个数据绑定的包：
<!-- https://mvnrepository.com/artifact/com.fasterxml.jackson.core/jackson-databind -->
<dependency>
<groupId>com.fasterxml.jackson.core</groupId>
<artifactId>jackson-databind</artifactId>
<version>2.8.8</version>
</dependency>
之后我们将分页信息使用通用的信息类 Msg 进行包装，方便我们进行一些返回JSON的操作：
package cn.crud.bean; import java.util.HashMap;
import java.util.Map; /**
* 通用的返回信息的类
*
*/
public class Msg { //状态码，自定义一些状态码对应的状态
private int code;
//提示信息
private String msg; //用户给浏览器的数据，比如说返回的PageInfo信息
private Map<String,Object> map = new HashMap<String,Object>(); /**
* 操作成功的静态方法
* @return
*/
public static Msg success(){
Msg result = new Msg();
//这里100表示成功
result.setCode(100);
result.setMsg("操作成功");
return result;
} /**
* 操作失败的静态方法
* @return
*/
public static Msg fail(){
Msg result = new Msg();
//这里100表示成功
result.setCode(200);
result.setMsg("操作失败");
return result;
}
/**
* 快捷添加信息的方法
* @return
*/
public Msg add(String key,Object value){
this.getMap().put(key, value);
return this;
} public int getCode() {
return code;
} public void setCode(int code) {
this.code = code;
} public String getMsg() {
return msg;
} public void setMsg(String msg) {
this.msg = msg;
} public Map<String, Object> getMap() {
return map;
} public void setMap(Map<String, Object> map) {
this.map = map;
} }
//Msg信息类中包含一些必要的属性与我们需要的静态方法
将controller中的返回分页信息方法进行改写，让他返回msg方便进行ajax的改造：
/**
* 分页信息的AJAX请求
* @ResponseBody可以将返回的对象转为JSON字符串
* 此注解需要引入jackson的包（以及注解驱动的配置等，这里已经进行配置）
* 将返回信息包装在msg里
*/
@RequestMapping("/emps")
@ResponseBody
public Msg getEmpsWithJson(@RequestParam(value="pn",defaultValue="1") Integer pn, Model model){
//改造为一个分页查询
//在查询之前传入分页参数：起始页和每页记录数
PageHelper.startPage(pn, 5);
//后面紧跟的查询就是分页查询
List<Employee> empList = empService.getAll();
//用PageInfo对结果进行包装，只需要将PageInfo交给页面即可，这里面封装了详细的信息,第二个参数为需要连续显示的记录数
PageInfo page = new PageInfo(empList,5);
//直接将pageInfo对象进行返回
//将pageInfo放在msg里进行返回，链式操作返回对象本身
return Msg.success().add("pageInfo", page);
}
然后，我们先将index.jsp重命名为index-old.jsp先放一边，new 一个index.jsp进行改造：
我们先用ajax改造表格的生成部分：
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>员工列表</title>
<%
pageContext.setAttribute("path",request.getContextPath());
%>
<!-- 推荐以 / 开始的相对路径（以服务器的根路径为相对路径） -->
<link href="${path}/static/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- 先引入jQuery，再引入js -->
<script type="text/javascript" src="${path}/static/bootstrap/js/jquery.min.js"> </script>
<script src="${path}/static/bootstrap/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<!-- 分为四大行 -->
<!-- 标题 -->
<div class="row">
<div class="col-md-12">
<font size="20">SSM-CRUD</font>
</div>
</div>
<!-- 按钮 -->
<div class="row">
<!-- 偏移4列 -->
<div class="col-md-4 col-md-offset-8">
<button type="button" class="btn btn-primary ">新增</button>
<button type="button" class="btn btn-danger ">删除</button>
</div>
</div>
<!-- 表格 -->
<div class="row">
<div class="col-md-12">
<table class="table table-hover" id="emps_table">
<thead>
<tr>
<th>#</th>
<th>empName</th>
<th>empEmail</th>
<th>gender</th>
<th>deptName</th>
<th>操作</th>
</tr>
</thead>
<tbody> </tbody>
</table>
</div>
</div>
<!-- 分页信息 -->
<div class="row">
<!-- 分页文字信息，其中分页信息都封装在pageInfo中 -->
<div class="col-md-6">
当前第：页，总共：页，总共：条记录
</div>
<!-- 分页条 -->
<div class="col-md-6"> </div>
</div>
</div>
<script type="text/javascript">
//页面加载完成后直接发送ajax请求，取得分页数据
$(function(){
$.ajax({
//请求方式
type : "GET",
//请求url
url : "${path}/emps",
//请求要带的数据
data :"pn=1",
//请求成功的回调函数
success : function(result) {
//1.解析JSON返回员工数据
build_emps_table(result)
//2.解析生成分页信息 }
});
});
//解析员工数据
function build_emps_table(result){
//员工数据
var emps = result.map.pageInfo.list;
//使用jQuery遍历数组，遍历的是取出来的json数组，可以通过开发工具查看JSON结构
$.each(emps,function(idx,item){
//使用jQuery生成各列
var empIdTd = $("<td></td>").append(item.empId);
var empNameTd = $("<td></td>").append(item.empName);
//三目运算符处理性别
var genderTd = $("<td></td>").append(item.gender=="M"?"男":"女");
var emailTd = $("<td></td>").append(item.email);
var deptNameTd = $("<td></td>").append(item.department.deptName);
//添加操作按钮，通过jQuery的一些操作（例如CSS的追加CSS操作），完成按钮的构建
var editBtn = $("<button></button>").addClass("btn btn-info btn-sm")
.append($("<span></span>").addClass("glyphicon glyphicon-pencil"))
.append("编辑");
var delBtn = $("<button></button>").addClass("btn btn-danger btn-sm")
.append($("<span></span>").addClass("glyphicon glyphicon-trash"))
.append("删除");
var btnTd = $("<td></td>").append(editBtn).append(" ").append(delBtn);
//链式操作完成列的添加（链式操作由于jQuery返回的是原元素）
$("<tr></tr>").append(empIdTd)
.append(empNameTd)
.append(genderTd)
.append(emailTd)
.append(deptNameTd)
.append(deptNameTd)
.append(btnTd)
.appendTo($("#emps_table tbody"));
});
}
//生成分页导航信息
function build_pages_nav(result){ }
</script>
</body>
</html>
//这里需要适当复习一下jQuery
我们再解析分页信息和分页条部分：
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>员工列表</title>
<%
pageContext.setAttribute("path",request.getContextPath());
%>
<!-- 推荐以 / 开始的相对路径（以服务器的根路径为相对路径） -->
<link href="${path}/static/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- 先引入jQuery，再引入js -->
<script type="text/javascript" src="${path}/static/bootstrap/js/jquery.min.js"> </script>
<script src="${path}/static/bootstrap/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<!-- 分为四大行 -->
<!-- 标题 -->
<div class="row">
<div class="col-md-12">
<font size="20">SSM-CRUD</font>
</div>
</div>
<!-- 按钮 -->
<div class="row">
<!-- 偏移4列 -->
<div class="col-md-4 col-md-offset-8">
<button type="button" class="btn btn-primary ">新增</button>
<button type="button" class="btn btn-danger ">删除</button>
</div>
</div>
<!-- 表格 -->
<div class="row">
<div class="col-md-12">
<table class="table table-hover" id="emps_table">
<thead>
<tr>
<th>#</th>
<th>empName</th>
<th>empEmail</th>
<th>gender</th>
<th>deptName</th>
<th>操作</th>
</tr>
</thead>
<tbody> </tbody>
</table>
</div>
</div>
<!-- 分页信息 -->
<div class="row">
<!-- 分页文字信息，其中分页信息都封装在pageInfo中 -->
<div class="col-md-6" id="page_info"> </div>
<!-- 分页条 -->
<div class="col-md-6" id="page_nav"> </div>
</div>
</div>
<script type="text/javascript">
//页面加载完成后直接发送ajax请求，取得分页数据
$(function(){
$.ajax({
//请求方式
type : "GET",
//请求url
url : "${path}/emps",
//请求要带的数据
data :"pn=1",
//请求成功的回调函数
success : function(result) {
//1.解析JSON返回员工数据
build_emps_table(result);
//2.解析生成分页信息(分页条与分页导航)
build_pages_info(result);
build_pages_nav(result);
}
});
});
//解析员工数据
function build_emps_table(result){
//员工数据
var emps = result.map.pageInfo.list;
//使用jQuery遍历数组，遍历的是取出来的json数组，可以通过开发工具查看JSON结构
$.each(emps,function(idx,item){
//使用jQuery生成各列
var empIdTd = $("<td></td>").append(item.empId);
var empNameTd = $("<td></td>").append(item.empName);
//三目运算符处理性别
var genderTd = $("<td></td>").append(item.gender=="M"?"男":"女");
var emailTd = $("<td></td>").append(item.email);
var deptNameTd = $("<td></td>").append(item.department.deptName);
//添加操作按钮，通过jQuery的一些操作（例如CSS的追加CSS操作），完成按钮的构建
var editBtn = $("<button></button>").addClass("btn btn-info btn-sm")
.append($("<span></span>").addClass("glyphicon glyphicon-pencil"))
.append("编辑");
var delBtn = $("<button></button>").addClass("btn btn-danger btn-sm")
.append($("<span></span>").addClass("glyphicon glyphicon-trash"))
.append("删除");
var btnTd = $("<td></td>").append(editBtn).append(" ").append(delBtn);
//链式操作完成列的添加（链式操作由于jQuery返回的是原元素）
$("<tr></tr>").append(empIdTd)
.append(empNameTd)
.append(genderTd)
.append(emailTd)
.append(deptNameTd)
.append(deptNameTd)
.append(btnTd)
.appendTo($("#emps_table tbody"));
});
}
//生成分页信息
function build_pages_info(result){
//当前页
var currentPage = result.map.pageInfo.pageNum;
//总页数
var totalPage = result.map.pageInfo.pages;
//总记录数
var totalCount = result.map.pageInfo.total;
$("#page_info").append("当前第："+currentPage+"页，"+"总共："+totalPage+"页，"+"总共："+totalCount+"条记录");
}
//生成分页导航信息
function build_pages_nav(result){
//导航条外层的Ul
var navUl = $("<ul></ul>").addClass("pagination");
//首页
var firstPageLi = $("<li></li>").append($("<a></a>").append("首页").attr("href","#"));
//前一页
var prePageLi = $("<li></li>").append($("<a></a>").append("«"));
//判断是否有首页
if(result.map.pageInfo.hasPreviousPage == false){
firstPageLi.addClass("disabled");
prePageLi.addClass("disabled");
}
//后一页
var nextPageLi = $("<li></li>").append($("<a></a>").append("»"));
//末页
var lastPageLi = $("<li></li>").append($("<a></a>").append("末页").attr("href","#"));
//判断是否有末页
if(result.map.pageInfo.hasNextPage == false){
lastPageLi.addClass("disabled");
nextPageLi.addClass("disabled");
} //添加到ul
navUl.append(firstPageLi).append(prePageLi); //遍历页码数
$.each(result.map.pageInfo.navigatepageNums,function(idx,item){
var numLi = $("<li></li>").append($("<a></a>").append(item));
//如果为当前页，则高亮显示，采用增加类的方法完成
if(result.map.pageInfo.pageNum == item){
numLi.addClass("active");
}
navUl.append(numLi);
});
navUl.append(nextPageLi).append(lastPageLi);
var navEle = $("<nav></nav>").append(navUl);
$("#page_nav").append(navEle);
}
</script>
</body>
</html>
//这样，加上一些页面的处理后，整个页面框架就搭建出来了
接下来我们进行一些事件的处理，例如导航条的页码，是点击后再发送ajax请求进行查询显示的，我们对页面再次进行改造：
我们对页码进行单击事件绑定与相关函数的抽取，完成后的index.jsp页面如下
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>员工列表</title>
<%
pageContext.setAttribute("path",request.getContextPath());
%>
<!-- 推荐以 / 开始的相对路径（以服务器的根路径为相对路径） -->
<link href="${path}/static/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- 先引入jQuery，再引入js -->
<script type="text/javascript" src="${path}/static/bootstrap/js/jquery.min.js"> </script>
<script src="${path}/static/bootstrap/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<!-- 分为四大行 -->
<!-- 标题 -->
<div class="row">
<div class="col-md-12">
<font size="20">SSM-CRUD</font>
</div>
</div>
<!-- 按钮 -->
<div class="row">
<!-- 偏移4列 -->
<div class="col-md-4 col-md-offset-8">
<button type="button" class="btn btn-primary ">新增</button>
<button type="button" class="btn btn-danger ">删除</button>
</div>
</div>
<!-- 表格 -->
<div class="row">
<div class="col-md-12">
<table class="table table-hover" id="emps_table">
<thead>
<tr>
<th>#</th>
<th>empName</th>
<th>empEmail</th>
<th>gender</th>
<th>deptName</th>
<th>操作</th>
</tr>
</thead>
<tbody> </tbody>
</table>
</div>
</div>
<!-- 分页信息 -->
<div class="row">
<!-- 分页文字信息，其中分页信息都封装在pageInfo中 -->
<div class="col-md-6" id="page_info"> </div>
<!-- 分页条 -->
<div class="col-md-6" id="page_nav"> </div>
</div>
</div>
<script type="text/javascript">
//页面加载完成后直接发送ajax请求，取得分页数据
$(function(){
//加载完页面就通过这个函数发ajax请求
toPage(1);
});
//跳转到某页的函数
function toPage(pn){
$.ajax({
//请求方式
type : "GET",
//请求url
url : "${path}/emps",
//请求要带的数据
data :"pn="+pn,
//请求成功的回调函数
success : function(result) {
//1.解析JSON返回员工数据
build_emps_table(result);
//2.解析生成分页信息(分页条与分页导航)
build_pages_info(result);
build_pages_nav(result);
}
});
}
//解析员工数据
function build_emps_table(result){
//员工数据
var emps = result.map.pageInfo.list;
//使用jQuery遍历数组，遍历的是取出来的json数组，可以通过开发工具查看JSON结构
$.each(emps,function(idx,item){
//使用jQuery生成各列
var empIdTd = $("<td></td>").append(item.empId);
var empNameTd = $("<td></td>").append(item.empName);
//三目运算符处理性别
var genderTd = $("<td></td>").append(item.gender=="M"?"男":"女");
var emailTd = $("<td></td>").append(item.email);
var deptNameTd = $("<td></td>").append(item.department.deptName);
//添加操作按钮，通过jQuery的一些操作（例如CSS的追加CSS操作），完成按钮的构建
var editBtn = $("<button></button>").addClass("btn btn-info btn-sm")
.append($("<span></span>").addClass("glyphicon glyphicon-pencil"))
.append("编辑");
var delBtn = $("<button></button>").addClass("btn btn-danger btn-sm")
.append($("<span></span>").addClass("glyphicon glyphicon-trash"))
.append("删除");
var btnTd = $("<td></td>").append(editBtn).append(" ").append(delBtn);
//链式操作完成列的添加（链式操作由于jQuery返回的是原元素）
$("<tr></tr>").append(empIdTd)
.append(empNameTd)
.append(genderTd)
.append(emailTd)
.append(deptNameTd)
.append(deptNameTd)
.append(btnTd)
.appendTo($("#emps_table tbody"));
});
}
//生成分页信息
function build_pages_info(result){
//当前页
var currentPage = result.map.pageInfo.pageNum;
//总页数
var totalPage = result.map.pageInfo.pages;
//总记录数
var totalCount = result.map.pageInfo.total;
$("#page_info").append("当前第："+currentPage+"页，"+"总共："+totalPage+"页，"+"总共："+totalCount+"条记录");
}
//生成分页导航信息
function build_pages_nav(result){
//导航条外层的Ul
var navUl = $("<ul></ul>").addClass("pagination");
//首页
var firstPageLi = $("<li></li>").append($("<a></a>").append("首页").attr("href","#"));
//前一页
var prePageLi = $("<li></li>").append($("<a></a>").append("«"));
//判断是否有首页
if(result.map.pageInfo.hasPreviousPage == false){
firstPageLi.addClass("disabled");
prePageLi.addClass("disabled");
}
//后一页
var nextPageLi = $("<li></li>").append($("<a></a>").append("»"));
//末页
var lastPageLi = $("<li></li>").append($("<a></a>").append("末页").attr("href","#"));
//判断是否有末页
if(result.map.pageInfo.hasNextPage == false){
lastPageLi.addClass("disabled");
nextPageLi.addClass("disabled");
} //添加到ul
navUl.append(firstPageLi).append(prePageLi); //遍历页码数
$.each(result.map.pageInfo.navigatepageNums,function(idx,item){
var numLi = $("<li></li>").append($("<a></a>").append(item));
//如果当前页为正在遍历的页，则高亮显示，采用增加类的方法完成
if(result.map.pageInfo.pageNum == item){
numLi.addClass("active");
}
//给每个页码添加单击绑定事件
numLi.click(function(){
toPage(item);
});
navUl.append(numLi);
});
navUl.append(nextPageLi).append(lastPageLi);
var navEle = $("<nav></nav>").append(navUl);
$("#page_nav").append(navEle);
}
</script>
</body>
</html>
我们测试一下，很容易发现问题：
页面虽然数据正常返回，但由于是无刷新的返回数据，造成数据的追加而不是替换！我们再次进行改造：
在所有操作之前进行数据的清空，于是，改造页面如下：
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>员工列表</title>
<%
pageContext.setAttribute("path",request.getContextPath());
%>
<!-- 推荐以 / 开始的相对路径（以服务器的根路径为相对路径） -->
<link href="${path}/static/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- 先引入jQuery，再引入js -->
<script type="text/javascript" src="${path}/static/bootstrap/js/jquery.min.js"> </script>
<script src="${path}/static/bootstrap/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<!-- 分为四大行 -->
<!-- 标题 -->
<div class="row">
<div class="col-md-12">
<font size="20">SSM-CRUD</font>
</div>
</div>
<!-- 按钮 -->
<div class="row">
<!-- 偏移4列 -->
<div class="col-md-4 col-md-offset-8">
<button type="button" class="btn btn-primary ">新增</button>
<button type="button" class="btn btn-danger ">删除</button>
</div>
</div>
<!-- 表格 -->
<div class="row">
<div class="col-md-12">
<table class="table table-hover" id="emps_table">
<thead>
<tr>
<th>#</th>
<th>empName</th>
<th>empEmail</th>
<th>gender</th>
<th>deptName</th>
<th>操作</th>
</tr>
</thead>
<tbody> </tbody>
</table>
</div>
</div>
<!-- 分页信息 -->
<div class="row">
<!-- 分页文字信息，其中分页信息都封装在pageInfo中 -->
<div class="col-md-6" id="page_info"> </div>
<!-- 分页条 -->
<div class="col-md-6" id="page_nav"> </div>
</div>
</div>
<script type="text/javascript">
//页面加载完成后直接发送ajax请求，取得分页数据
$(function(){
//加载完页面就通过这个函数发ajax请求
toPage(1);
});
//跳转到某页的函数
function toPage(pn){
$.ajax({
//请求方式
type : "GET",
//请求url
url : "${path}/emps",
//请求要带的数据
data :"pn="+pn,
//请求成功的回调函数
success : function(result) {
//1.解析JSON返回员工数据
build_emps_table(result);
//2.解析生成分页信息(分页条与分页导航)
build_pages_info(result);
build_pages_nav(result);
}
});
}
//解析员工数据
function build_emps_table(result){
//清空表格数据
$("#emps_table tbody").empty();
//员工数据
var emps = result.map.pageInfo.list;
//使用jQuery遍历数组，遍历的是取出来的json数组，可以通过开发工具查看JSON结构
$.each(emps,function(idx,item){
//使用jQuery生成各列
var empIdTd = $("<td></td>").append(item.empId);
var empNameTd = $("<td></td>").append(item.empName);
//三目运算符处理性别
var genderTd = $("<td></td>").append(item.gender=="M"?"男":"女");
var emailTd = $("<td></td>").append(item.email);
var deptNameTd = $("<td></td>").append(item.department.deptName);
//添加操作按钮，通过jQuery的一些操作（例如CSS的追加CSS操作），完成按钮的构建
var editBtn = $("<button></button>").addClass("btn btn-info btn-sm")
.append($("<span></span>").addClass("glyphicon glyphicon-pencil"))
.append("编辑");
var delBtn = $("<button></button>").addClass("btn btn-danger btn-sm")
.append($("<span></span>").addClass("glyphicon glyphicon-trash"))
.append("删除");
var btnTd = $("<td></td>").append(editBtn).append(" ").append(delBtn);
//链式操作完成列的添加（链式操作由于jQuery返回的是原元素）
$("<tr></tr>").append(empIdTd)
.append(empNameTd)
.append(genderTd)
.append(emailTd)
.append(deptNameTd)
.append(deptNameTd)
.append(btnTd)
.appendTo($("#emps_table tbody"));
});
}
//生成分页信息
function build_pages_info(result){
//清空分页数据
$("#page_info").empty();
//当前页
var currentPage = result.map.pageInfo.pageNum;
//总页数
var totalPage = result.map.pageInfo.pages;
//总记录数
var totalCount = result.map.pageInfo.total;
$("#page_info").append("当前第："+currentPage+"页，"+"总共："+totalPage+"页，"+"总共："+totalCount+"条记录");
}
//生成分页导航信息
function build_pages_nav(result){
//清空分页导航信息
$("#page_nav").empty();
//导航条外层的Ul
var navUl = $("<ul></ul>").addClass("pagination");
//首页
var firstPageLi = $("<li></li>").append($("<a></a>").append("首页").attr("href","#"));
//前一页
var prePageLi = $("<li></li>").append($("<a></a>").append("«"));
//判断是否有首页
if(result.map.pageInfo.hasPreviousPage == false){
firstPageLi.addClass("disabled");
prePageLi.addClass("disabled");
}
//添加首页和前一页翻页的单机事件
firstPageLi.click(function(){
toPage(1);
});
prePageLi.click(function(){
toPage(result.map.pageInfo.pageNum-1);
});
//后一页
var nextPageLi = $("<li></li>").append($("<a></a>").append("»"));
//末页
var lastPageLi = $("<li></li>").append($("<a></a>").append("末页").attr("href","#"));
//判断是否有末页
if(result.map.pageInfo.hasNextPage == false){
lastPageLi.addClass("disabled");
nextPageLi.addClass("disabled");
}
//添加末页和后一页翻页的单机事件
lastPageLi.click(function(){
toPage(result.map.pageInfo.pages);
});
nextPageLi.click(function(){
toPage(result.map.pageInfo.pageNum+1);
});
//添加到ul
navUl.append(firstPageLi).append(prePageLi); //遍历页码数
$.each(result.map.pageInfo.navigatepageNums,function(idx,item){
var numLi = $("<li></li>").append($("<a></a>").append(item));
//如果当前页为正在遍历的页，则高亮显示，采用增加类的方法完成
if(result.map.pageInfo.pageNum == item){
numLi.addClass("active");
}
//给每个页码添加单击绑定事件
numLi.click(function(){
toPage(item);
});
navUl.append(numLi);
});
navUl.append(nextPageLi).append(lastPageLi);
var navEle = $("<nav></nav>").append(navUl);
$("#page_nav").append(navEle);
}
</script>
</body>
</html>
为了页码的正常显示，我们在插件中配置一个合理化的参数，参数的具体作用请参见文档：
<!-- 分页插件的使用 -->
<plugins>
<plugin interceptor="com.github.pagehelper.PageInterceptor">
<!-- 配置合理化参数 -->
<property name="reasonable" value="true"/>
</plugin>
</plugins>
我们把前面的代码稍微优化一下，如果按钮禁用了，就不绑定事件了，可用时才绑定事件：
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>员工列表</title>
<%
pageContext.setAttribute("path",request.getContextPath());
%>
<!-- 推荐以 / 开始的相对路径（以服务器的根路径为相对路径） -->
<link href="${path}/static/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- 先引入jQuery，再引入js -->
<script type="text/javascript" src="${path}/static/bootstrap/js/jquery.min.js"> </script>
<script src="${path}/static/bootstrap/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<!-- 分为四大行 -->
<!-- 标题 -->
<div class="row">
<div class="col-md-12">
<font size="20">SSM-CRUD</font>
</div>
</div>
<!-- 按钮 -->
<div class="row">
<!-- 偏移4列 -->
<div class="col-md-4 col-md-offset-8">
<button type="button" class="btn btn-primary ">新增</button>
<button type="button" class="btn btn-danger ">删除</button>
</div>
</div>
<!-- 表格 -->
<div class="row">
<div class="col-md-12">
<table class="table table-hover" id="emps_table">
<thead>
<tr>
<th>#</th>
<th>empName</th>
<th>empEmail</th>
<th>gender</th>
<th>deptName</th>
<th>操作</th>
</tr>
</thead>
<tbody> </tbody>
</table>
</div>
</div>
<!-- 分页信息 -->
<div class="row">
<!-- 分页文字信息，其中分页信息都封装在pageInfo中 -->
<div class="col-md-6" id="page_info"> </div>
<!-- 分页条 -->
<div class="col-md-6" id="page_nav"> </div>
</div>
</div>
<script type="text/javascript">
//页面加载完成后直接发送ajax请求，取得分页数据
$(function(){
//加载完页面就通过这个函数发ajax请求
toPage(1);
});
//跳转到某页的函数
function toPage(pn){
$.ajax({
//请求方式
type : "GET",
//请求url
url : "${path}/emps",
//请求要带的数据
data :"pn="+pn,
//请求成功的回调函数
success : function(result) {
//1.解析JSON返回员工数据
build_emps_table(result);
//2.解析生成分页信息(分页条与分页导航)
build_pages_info(result);
build_pages_nav(result);
}
});
}
//解析员工数据
function build_emps_table(result){
//清空表格数据
$("#emps_table tbody").empty();
//员工数据
var emps = result.map.pageInfo.list;
//使用jQuery遍历数组，遍历的是取出来的json数组，可以通过开发工具查看JSON结构
$.each(emps,function(idx,item){
//使用jQuery生成各列
var empIdTd = $("<td></td>").append(item.empId);
var empNameTd = $("<td></td>").append(item.empName);
//三目运算符处理性别
var genderTd = $("<td></td>").append(item.gender=="M"?"男":"女");
var emailTd = $("<td></td>").append(item.email);
var deptNameTd = $("<td></td>").append(item.department.deptName);
//添加操作按钮，通过jQuery的一些操作（例如CSS的追加CSS操作），完成按钮的构建
var editBtn = $("<button></button>").addClass("btn btn-info btn-sm")
.append($("<span></span>").addClass("glyphicon glyphicon-pencil"))
.append("编辑");
var delBtn = $("<button></button>").addClass("btn btn-danger btn-sm")
.append($("<span></span>").addClass("glyphicon glyphicon-trash"))
.append("删除");
var btnTd = $("<td></td>").append(editBtn).append(" ").append(delBtn);
//链式操作完成列的添加（链式操作由于jQuery返回的是原元素）
$("<tr></tr>").append(empIdTd)
.append(empNameTd)
.append(genderTd)
.append(emailTd)
.append(deptNameTd)
.append(deptNameTd)
.append(btnTd)
.appendTo($("#emps_table tbody"));
});
}
//生成分页信息
function build_pages_info(result){
//清空分页数据
$("#page_info").empty();
//当前页
var currentPage = result.map.pageInfo.pageNum;
//总页数
var totalPage = result.map.pageInfo.pages;
//总记录数
var totalCount = result.map.pageInfo.total;
$("#page_info").append("当前第："+currentPage+"页，"+"总共："+totalPage+"页，"+"总共："+totalCount+"条记录");
}
//生成分页导航信息
function build_pages_nav(result){
//清空分页导航信息
$("#page_nav").empty();
//导航条外层的Ul
var navUl = $("<ul></ul>").addClass("pagination");
//首页
var firstPageLi = $("<li></li>").append($("<a></a>").append("首页").attr("href","#"));
//前一页
var prePageLi = $("<li></li>").append($("<a></a>").append("«"));
//判断是否有首页
if(result.map.pageInfo.hasPreviousPage == false){
firstPageLi.addClass("disabled");
prePageLi.addClass("disabled");
}else{
//添加首页和前一页翻页的单机事件
firstPageLi.click(function(){
toPage(1);
});
prePageLi.click(function(){
toPage(result.map.pageInfo.pageNum-1);
});
} //后一页
var nextPageLi = $("<li></li>").append($("<a></a>").append("»"));
//末页
var lastPageLi = $("<li></li>").append($("<a></a>").append("末页").attr("href","#"));
//判断是否有末页
if(result.map.pageInfo.hasNextPage == false){
lastPageLi.addClass("disabled");
nextPageLi.addClass("disabled");
}else{
//添加末页和后一页翻页的单机事件
lastPageLi.click(function(){
toPage(result.map.pageInfo.pages);
});
nextPageLi.click(function(){
toPage(result.map.pageInfo.pageNum+1);
});
} //添加到ul
navUl.append(firstPageLi).append(prePageLi); //遍历页码数
$.each(result.map.pageInfo.navigatepageNums,function(idx,item){
var numLi = $("<li></li>").append($("<a></a>").append(item));
//如果当前页为正在遍历的页，则高亮显示，采用增加类的方法完成
if(result.map.pageInfo.pageNum == item){
numLi.addClass("active");
}
//给每个页码添加单击绑定事件
numLi.click(function(){
toPage(item);
});
navUl.append(numLi);
});
navUl.append(nextPageLi).append(lastPageLi);
var navEle = $("<nav></nav>").append(navUl);
$("#page_nav").append(navEle);
}
</script>
</body>
</html>
至此，查询完成！
SSM-CRUD入门项目——查询的更多相关文章
- 【JAVA - SSM】之SSM入门项目的搭建
最近学习了一下SSM.SSM是 Spring + SpringMVC + MyBatis 整合框架,非常适合WEB后台开发,也是当前很多人的不二选择.这篇博客带大家来创建一个学习SSM的入门程序,从搭 ...
- 【JavaEE】之SSM入门项目的搭建
最近学习了一下SSM.SSM是 Spring + SpringMVC + MyBatis 整合框架,非常适合WEB后台开发,也是当前很多人的不二选择.这篇博客带大家来创建一个学习SSM的入门程序,从搭 ...
- 1 JPA入门----项目搭建以及CRUD
maven搭建JPA开发环境 1 依赖的maven pom文件 主要有hibernate-core.hibernate-entitymanager.javax-persistence.mysq ...
- SpringMVC详解及SSM框架整合项目
SpringMVC ssm : mybatis + Spring + SpringMVC MVC三层架构 JavaSE:认真学习,老师带,入门快 JavaWeb:认真学习,老师带,入门快 SSM框架: ...
- idea导入ssm javaweb maven项目
本文笔者辛苦整理, 除了为方便大家贴的maven安装配置和方便的现有项目, 如转载请注明: https://www.cnblogs.com/m-yb/p/11229320.html idea导入ssm ...
- 后端分页神器，mybatis pagehelper 在SSM与springboot项目中的使用
mybatis pagehelper想必大家都耳熟能详了,是java后端用于做分页查询时一款非常好用的分页插件,同时也被人们称为mybatis三剑客之一,下面 就给大家讲讲如何在SSM项目和sprin ...
- 基于renren-fast的快速入门项目实战（实现报表增删改查）
基于renren-fast的快速入门项目实战(实现报表增删改查) 说明:renren-fast是一个开源的基于springboot的前后端分离手脚架,当前版本是3.0 官方开发文档需付费,对于新手而言 ...
- MongoDB 入门之查询（find）
MongoDB 入门之查询(find) 1. find 简介 (1)find的第一个参数决定了要返回哪些文档. 空的查询文档会匹配集合的全部内容.默认就是{}.结果将批量返回集合c中的所有文档. db ...
- kaggle入门项目：Titanic存亡预测 （一）比赛简介
自从入了数据挖掘的坑,就在不停的看视频刷书,但是总觉得实在太过抽象,在结束了coursera上Andrew Ng 教授的机器学习课程还有刷完一整本集体智慧编程后更加迷茫了,所以需要一个实践项目来扎实之 ...
随机推荐
- December 29th 2016 Week 53rd Thursday
The true nobility is in being superior to your previous self. 真正的高贵在于超越过去的自己. It is really difficult ...
- 78、WebClient实现上传下载 System.Net、System.Uri类
高层类.使用简单.均支持异步版本.支持http,https,fpt,files等URI. 一.下载 方法: Stream= client.OpenRead(serverUri): 打开一个可读的流.对 ...
- Dictionary<Tkey.TValue>与SortedList
一.概述 表示Key/Value集合,可以添加删除元素,允许按Key来访问元素.是Hashtable的泛型等效类. 它需要一个相等实现来确定键是否相等,可以使用实现了IEqualityComparer ...
- kafka部分重要参数配置-broker端参数
broker端参数主要在config/server.properties目录下设置: 启动命令:nohup ./kafka-server-start.sh -daemon ../config/serv ...
- Github的commit规范
参考链接:GIT写出好的 commit message 基本要求 第一行应该少于50个字. 随后是一个空行 第一行题目也可以写成:Fix issue #8976 永远不在 git commit 上增加 ...
- 有关js弹出提示框几种方法
1直接提示只有确定功能的提示框 只显示提示信息 alert(“提示信息”); alert ();的参数只有一个就是提示信息,无返回值 2 弹出输入框让你输入内容 prompt() ; 有两个参数:第一 ...
- meta标签的使用（转）
1.Expires(期限) 说明:可以用于设定网页的到期时间.一旦网页过期,必须到服务器上重新传输. 用法: <meta http-equiv="expires" conte ...
- jq实现 元素显示后 点击页面的任何位置除元素本身外 隐藏元素
$(".share-weixin").on("click",function(e){ var $wx=$(".weixin-share"), ...
- 搭建 PhoneGap 开发环境
一.JDK 下载以及安装.配置 参考:http://www.cnblogs.com/LO-ME/p/3530345.html 二.Android开发环境的搭建 参考:http://www.cnblog ...
- c++ 派生类的复制函数次序，及子父类兼容性
#include <iostream> using namespace std; class CFatherSum //父类Sum { public: CFatherSum(){cout& ...