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

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

(一)目录结构：

---

(二)前端静态页面代码

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

	
		
		
		
		
		
	
	
		
		
学生管理系统
		

		


	

为了解决AJAX跨域请求问题 在StudentControllar的findPage方法，添加HttpServletResponse response参数

代码块中添加： response.setHeader("Access-Control-Allow-Origin","*");

add.html

	
		
		
	
	
		
添加学生
		

		

			

				姓名：
			
			

				年龄：
			
			

				性别：
				男
				女
			
			

				
			
		
	

update.html

	
		
		
	
	
		
修改
		

		

			
			

				id： 
			
			
			

				姓名：
			
			

				年龄：
			
			

				性别：
				男
				女
			
			

				
			
		
	

---

(三)测试

3.1 启动项目后，在地址栏输入 http://localhost:8888/kude/ 进入到index.html页面，通过AJAX执行了后台的分页查询方法。

点击上一页，下一页可以进入到对应的页面。

3.2 添加学生

点击保存后返回json数据

数据库：

3.3 删除

点击“阿杰"行的删除。

页面输出删除成功信息

3.4 修改

修改id为1的数据

成功

---

看到这里辛苦了：

项目源码已经发布到gitee 公开可供下载

链接 https://gitee.com/kluadias/springbootdemo