从零开始完成一个SpringBoot+JPA的学生管理系统Web案例((三)前端实现)

最新推荐文章于 2025-04-17 23:02:40 发布

是镜子阿

最新推荐文章于 2025-04-17 23:02:40 发布

阅读量2.1k

点赞数 6

分类专栏： SpringBoot 文章标签： SpringBoot+JPA 前端页面 JavaWeb

本文链接：https://blog.csdn.net/weixin_42158633/article/details/89743568

版权

标题是前端实现，实际是前端和后端的共同实现。下面开始粘贴代码（太真实了）：

(一)目录结构：

(二)前端静态页面代码

2.1 创建css，img，js目录后到https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js 下载js文件，命名为jquery.js放置在js目录下。

2.2 页面源码：

index.html

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>主页</title>
		<script src="js/jquery.js" type="text/javascript" charset="UTF-8"></script>
		
		<script type="text/javascript">
			
 			var page = 1;
			var tablePage = 0;
			
			
			$(function(){
				showData();
			});
			//上一页
			function upPage(){		
				if(page > 1)
					page --;	
				showData();
			}
			// 下一页
			function downPage()
			{
				if(page < tablePage)
					page ++;	
				showData();
			}
			
			function showData(){
				
				$.ajax({
					url:'http://localhost:8888/kude/stu/query?page='+page,
					success:function(result){
						console.log(result.content);
						var rel = result.content;
						tablePage = result.tot