Web教程---学生管理系统->教师端

最新推荐文章于 2024-09-05 10:00:00 发布

知有丶

最新推荐文章于 2024-09-05 10:00:00 发布

阅读量3.6k

点赞数 6

分类专栏： Web教程文章标签： html web java

本文链接：https://blog.csdn.net/weixin_43854673/article/details/94409483

版权

Web教程专栏收录该内容

10 篇文章 2 订阅

订阅专栏

学生管理系统->教师端

一、创建TeacherLogin.jsp

注意创建在WebContent文件夹下

实现的内容：

1.四张狗儿子图片的轮播（对，就是我们宿舍那四个狗儿子）
2.一个登录界面
3.对输入框进行美化
4.对登录按钮进行美化
5.在账号或密码错误时弹窗出：请检查你的账号或密码！！！然后跳转回TeacherLogin.jsp

效果图：

在这里插入图片描述
输入错误时弹窗：

输入成功时跳转：
在这里插入图片描述

代码：

<%@ 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>

<style>
			img{
				width: 570px;
				height: 765px;
				display: none;/*图片消失*/
			}
			
			#header{
				background-color: #EEEEEE;
				color: black;
				text-align: center;
				padding: 5px;
				width:400px;
				heigh:100px;
				position: absolute;
				left: 870px;
				top: 200px;
			}
			
			#windows{
				position: absolute;
				left: 900px;
				top: 350px;
			}
			
			input{
                border: 1px solid #ccc;
                padding: 7px 0px;
                border-radius: 3px;
                padding-left:5px;
                -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
                box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
                -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
                -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
                transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s
            }
            
            input:focus{
                    border-color: #66afe9;
                    outline: 0;
                    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
                    box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6)
            }
			

</style>

</head>
<body onload="showImg(1)">
	<div>
			<img id="myImg1" src="img/img1.jpg"  border="1"/>
			<img id="myImg2" src="img/img2.jpg"  border="1"/>
			<img id="myImg3" src="img/img3.jpg"  border="1"/>
			<img id="myImg4" src="img/img4.jpg"  border="1"/>
			
	</div>
	
	<%
		Object msg=request.getAttribute("msg");
	if(msg!=null){
		out.println("<!DOCTYPE html>");
		out.println("<html>");
		out.println("<head>");
		out.println("<meta charset=\"UTF-8\">");
		out.println("<title></title>");
		out.println("</head>");
		out.println("<body>");
		out.println("</body>");
		out.println("<script>");
		out.println("alert(\"请检查你的账号或密码\")");
		out.println("</script>");
		out.println("</html>");
		
	}
	%>
	
		
	<div id="header">
			<h1>学生管理系统教师端</h1>
	</div>	
	
	<div id="windows">
		<form action="TeacherLoginServlet" method="post">
			账号：		<input style="width:250px;height:30px" id="username" type="text" name="username" placeholder="请输入用户名"/><br/>
			<br/>
			密码：		<input style="width:250px;height:30px" id="pass" type="password" name="pass" placeholder="请输入密码"/><br/>
		<br/>
		<input id="anniu" style="width:70px;height:35px" type="submit" value="登录"/>

		</form>
	</div>
</body>
<script>
		

		
		var nowshow=1;   //当前显示的图片
		var sid;	//声明sid用来接收serTimeOut返回值
		
		function showImg(index){
			
			
			if(Number(index)){
				clearTimeout(sid); 			//清除定时调用
				nowshow=index;
			}
			
			for (var i=1;i<5;i++) {
				
				if (i==nowshow) {
			document.getElementById("myImg"+nowshow).style.display="block";
					
				} else{
			document.getElementById("myImg"+i).style.display="none";					
				}
			}
			
			if(nowshow>=4){
				nowshow=1;
			}else{
				nowshow++;	
			}
			
			sid=setTimeout("showImg()",2000);//每隔3秒钟执行

		}
		
		
	</script>
</html>

二、创建Teacher.jsp

主要实现学生信息管理，可进行学生信息删除(暂未连接数据库)

<%@ 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>
		<style>
			#header{
				background-color: black;
				color: white;
				text-align: center;
				padding: 5px;
			}
			
			#nav{
				background-color: #EEEEEE;
				line-height: 30px;/*行高*/
				height: 560px;
				width: 120px;
				text-align: center;
				padding: 5px;
				float: left;/*不仅影响自己*/
			}
			
			#section{
				width: 800px;
				float: left;
				padding: 20px;
			}
			
			#footer{
				background-color: black;
				color: white;
				text-align: center;
				padding: 5px;
				clear: both;/*清除浮动*/
				height: 30px;
			}
			
			#nav2{
				list-style-type: none;
				margin: 0;  /*外边距*/
				padding: 0;  /*内边距*/
			}
			
			/*块状*/
			a{
				display: block;
				width: 100px;
				color: black;
				background-color: #BEBEBE;
				text-decoration: none; /*去掉下划线*/
				text-align: center;
				font-size: 20px;
				padding: 6px;
			}
			
			a:hover{
				color: white;
				background-color: black;
			}
			
			#stu3{
				color: black;
				background-color: white;
				font-size:18px;
			}
		</style>
</head>
<body>
		<div id="header">
			<h1>学生管理系统后台</h1>
		</div>

		<div id="nav">
			<ul id="nav2">
				<li><a href="#">学生管理</a></li>	
				<li><a href="#">学生成绩</a></li>	
				<li><a href="#">修改密码</a></li>	
				<li><a href="#">系统统计</a></li>	
				<li><a href="#">退出系统</a></li>	
			</ul>
		</div>

		<div id="section">
			<table>
			<tr>
				<td>姓名</td>
				<td>年龄</td>
				<td>年级</td>
				<td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;操作</td>
				
			</tr>
			
			<tr id="tr1">
				<td>吕某人</td>
				<td>18</td>
				<td>大三</td>
				<td><a id="stu3" href="javascript:removeTr(1)">删除</a></td>
				
			</tr>
			
			<tr id="tr2">
				<td>刘某人</td>
				<td>22</td>
				<td>大二</td>
				<td><a id="stu3" href="javascript:removeTr(2)">删除</a></td>
				
			</tr>
			
			<tr id="tr3">
				<td>刁某人</td>
				<td>87</td>
				<td>幼儿园</td>
				<td><a id="stu3" href="javascript:removeTr(3)">删除</a></td>
				
			</tr>
		</table>
		</div>

		<div id="footer">
			Copyright &copy;
			&nbsp;<font color="white">青岛大学天软软件基地实训</font>
		</div>
</body>
<script src="js/jquery-1.11.0.js"></script>
<script>
	function removeTr(index){
		var flag=confirm("请问确认删除嘛？");
		if(flag){
			$("#tr"+index).remove();
		}		
		
	}
</script>
</html>

三、创建TeacherLoginServlet.java

主要负责将用户名与密码与数据库中的进行对比

package org.lanqiao.servlet;

import java.io.IOException;
//import java.io.PrintWriter;
import java.sql.Connection;
import java.sql.ResultSet;
import java.sql.SQLException;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.lanqiao.bean.Student;
import org.lanqiao.util.DBUtil;

/**
 * Servlet implementation class TeacherLoginServlet
 */
@WebServlet("/TeacherLoginServlet")
public class TeacherLoginServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;
	
	
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		//处理请求中中文乱码
				request.setCharacterEncoding("utf-8");
				
				//获取用户名和密码
				String name=request.getParameter("username");
				String pass=request.getParameter("pass");
				
				//使用gdbc连接数据库判断用户名和密码是否正确
				
				//创建数据库连接
				Connection conn=DBUtil.getConn();
				String sql="select * from tea_tab where name=? and pass=?";
				
				//参数
				Object[] objs={name,pass};
				
				ResultSet rs=DBUtil.excuteQuery(sql, objs);
				
				//封装用户
				Student stu=null;
				
				try {
					if(rs.next()) {
						String stuName=rs.getString("name");
						String stuPass=rs.getString("pass");
						
						stu=new Student(stuName,stuPass);
					}
				} catch (SQLException e) {
					// TODO Auto-generated catch block
					e.printStackTrace();
				}
				
				if(stu!=null) {
					//登录成功，放入用户名，跳转到成功页	

					response.sendRedirect("TeacherHouTai.jsp");
				}else {
					
					//登陆失败，重定向到登录项
					request.setAttribute("msg", "请检查你的账号或密码是否正确！！！");
					
					request.getRequestDispatcher("TeacherLogin.jsp").forward(request, response);

				}
	}
}