<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib uri="/jsp/jstl/core" prefix="c" %>
<%
String path = ();
("path", path);
%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="${path }/js/jquery-1.8."></script>
<script type="text/javascript">
let pageNo = 1;
var pageTotal=0;
function up(){
if (pageNo == 1) {
alert("已经是第一页了");
return;
}
pageNo --;
page();
}
function down(){
if (pageTotal == pageNo) {
alert("已经是最后一页了");
return;
}
pageNo ++;
page();
}
function page(){
var object={
url:"${path}/student/?pageNo="+pageNo,
success:function(data){ //data是Tomcat执行完中foreach的结果
$("#showData").empty(); //将上一页清掉
$("#showData").append(data);
//上述代码执行完才会有input hidden ,就可以获取值
pageTotal=$("#pageTotal").val();
}
}
$.ajax(object);
}
</script>
</head>
<!-- 页面加载,加载完第一页发请求 向控制层,然后拿到数据以后返回到frag页面 ,然后Tomcat执行代码(el和jstl)-->
<body >
<!-- 解析中的代码,返回的是中table标签组成的数据,然后将数据放在div标签中 -->
<div id="showData">
<table border="1px" width="100%">
<thead>
<tr>
<th>序号</th>
<th>id</th>
<th>姓名</th>
<th>手机号</th>
<th>地址</th>
<th>操作</th>
</tr>
</thead>
<tbody style="text-align:center;">
<c:forEach var="student" items="${students }" varStatus="status" >
<tr>
<td>${+1 }</td>
<td>${ }</td>
<td>${}</td>
<td>${ }</td>
<td>${ }</td>
<td>查看 修改 删除</td>
</tr>
</c:forEach>
</tbody>
</table>
<input type="hidden" id="pageTotal" value="${pageTotal }" />
</div>
<div style="text-align:center; margin-top:10px">
<input onclick="up()" type="button" value="上一页">
<input onclick="down()" type="button" value="下一页">
</div>
</body>
</html>