教务系统
班级：12级计本2班
姓名：于海涛
时间：20##年06月08日
教务系统
实验目的：
1、了解简单的HTML标记
2、掌握链接标记的使用
3、掌握表格标记的使用
4、掌握表格嵌套的使用
5、简单的HTML<script>标签使用
6、Servlet的应用
7、Mov模式实例化
8、验证码技术->java绘图Graphics的使用+java随机函数Random()+javaIO
9、Jsp网页跳转
10、下载提示框
11、验证码验证 jsp内对象session的使用
实验环境：
1、jdk-6.0
2、apache-tomcat-6.0
3、Myeclipse-10.0
实验思想：
1、新建登陆页zhuyemian.jsp，表格嵌入表单，元素：用户名、密码，验证码。通过script验证，账号1111，密码1234，提交给ser01.java；
2、通过session获取提交的验证码和code.jsp生成的随机函数是否一致，一致转到neizhuye.jsp,否则返回zhuyemian.jsp；
3、主页包括neizhuye.jsp xuanke.jsp chengji.jsp pingjiao.jsp搭建统一框架；
4、主页通过onclick 和 <script>function 实现4个页面之间的转换，和退出到zhuyemian.jsp。并且内置各种按钮和嵌套表格 。
实验目录：
实验展示：
1、登陆页
2、主页
实验代码：
zhuyemiam.jsp
<%@ page language="java" import="java.util.*" pageEncoding="gb2312"%>
<html>
<body align="center" style="background:url('image/01.jpg') no-repeat;">
<script type="text/javascript">
function check(){
if(form1.mingzi.value==""){
alert("账号不能为空");
return;
}
if(form1.password.value==""){
alert("密码不能为空");
return;
}
if(form1.mingzi.value!="1111"){
alert("账号错啦");
return;
}
if(form1.password.value!="1234"){
alert("密码错啦");
return;
}
form1.submit();
}
</script>
<br> <br> <br>
<form name="form1" action="servlet/ser01" method="post">
<table border="0" borsercolor="black" cellspacing="0" cellpadding="0" align="center" width="900" height="400">
<tr>
<td width="450" height="400"> <img width="100%" height="273" align="center" src="image/03.jpg"></td>
<td width="450" height="100%">
<table style="background:url('image/05.jpg') no-repeat;" width="100%" height="313">
<tr> <td height="28%"> </td> </tr>
<tr>
<td width="120" align="right"><img src="image/011.png"></td>
<td width="60" align="center" style="color:blue">用户名: </td>
<td colspan="2"><input type="text" name="mingzi" size="15"> </td>
</tr>
<tr>
<td width="120" align="right"><img src="image/002.png"></td>
<td width="60" align="center" style="color:blue">密 码 :</td>
<td colspan="2"><input type="password" name="password" size="15"> </td>
</tr>
<tr>
<td width="120" align="right"><img src="image/003.png"></td>
<td width="60" align="center" style="color:blue">验证码: </td>
<td><input type="text" size="10" name="ma"> </td>
<td align="left"><img name="valimg" src="code.jsp"> <a href="zhuyemian.jsp">刷新</a> </td>
</tr>
<tr>
<td > </td>
<td align="right"><input type="button" value="提交" onClick="check()"> </td>
<td><input type="reset" value="取消"></td>
</tr>
<tr> <td height="15%"> </td> </tr>
</table>
</td>
</tr>
</table>
</form>
<br>
<table align="center" style="font-size:15px;">
<tr>
<td align="center" style="color:green"> 时间：20##年06月05日-------版权所有：12级计本2班-------联系电话：0451-******** </td>
</tr>
</table>
</body>
</html>
ser01.java
package pack01;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
public class ser01 extends HttpServlet {
/**
* Constructor of the object.
*/
public ser01() {
super();
}
/**
* Destruction of the servlet. <br>
*/
public void destroy() {
super.destroy(); // Just puts "destroy" string in log
// Put your code here
}
/**
* The doGet method of the servlet. <br>
*
* This method is called when a form has its tag value method equals to get.
*
* @param request the request send by the client to the server
* @param response the response send by the server to the client
* @throws ServletException if an error occurred
* @throws IOException if an error occurred
*/
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html");
response.setCharacterEncoding("gbk");
PrintWriter out = response.getWriter();
String code = request.getParameter("ma");
HttpSession session = request.getSession();
String randStr = (String)session.getAttribute("randStr");
if(!code.equals(randStr)){
response.sendRedirect("/haitao/zhuyemian.jsp");
}
else{
out.print("验证通过,正在跳转");
response.sendRedirect("/haitao/neizhuye.jsp");
}
out.flush();
out.close();
}
private void alert(String string) {
// TODO Auto-generated method stub
}
/**
* The doPost method of the servlet. <br>
*
* This method is called when a form has its tag value method equals to post.
*
* @param request the request send by the client to the server
* @param response the response send by the server to the client
* @throws ServletException if an error occurred
* @throws IOException if an error occurred
*/
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
this.doGet(request, response);
}
/**
* Initialization of the servlet. <br>
*
* @throws ServletException if an error occurs
*/
public void init() throws ServletException {
// Put your code here
}
}
serdowload.java
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.RequestDispatcher;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
public class serdownload extends HttpServlet {
/**
* Constructor of the object.
*/
public serdownload() {
super();
}
/**
* Destruction of the servlet. <br>
*/
public void destroy() {
super.destroy(); // Just puts "destroy" string in log
// Put your code here
}
/**
* The doGet method of the servlet. <br>
*
* This method is called when a form has its tag value method equals to get.
*
* @param request the request send by the client to the server
* @param response the response send by the server to the client
* @throws ServletException if an error occurred
* @throws IOException if an error occurred
*/
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
String filename = request.getParameter("file");
response.setHeader("Content-Disposition", "attachment;filename="+filename);
response.setContentType("image/jpeg");
RequestDispatcher rd = request.getRequestDispatcher("/image/"+filename);
rd.forward(request, response);
}
/**
* The doPost method of the servlet. <br>
*
* This method is called when a form has its tag value method equals to post.
*
* @param request the request send by the client to the server
* @param response the response send by the server to the client
* @throws ServletException if an error occurred
* @throws IOException if an error occurred
*/
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
this.doGet(request, response);
}
/**
* Initialization of the servlet. <br>
*
* @throws ServletException if an error occurs
*/
public void init() throws ServletException {
// Put your code here
}
}
code.jsp
<%@ page language="java" import="java.util.*" pageEncoding="gb2312"%>
<%@ page import="java.awt.*" %>
<%@ page import="java.awt.image.BufferedImage" %>
<%@ page import="javax.imageio.ImageIO" %>
<%
response.setHeader("Cache-Control", "no-cache");
int width=60,height=20;
BufferedImage image = new BufferedImage(width,height,BufferedImage.TYPE_INT_RGB);
Graphics g= image.getGraphics();
g.setColor(new Color(200,200,200));
g.fillRect(0, 0, width, height);
Random rnd = new Random();
int randNum = rnd.nextInt(8999)+1000;
String randStr = String.valueOf(randNum);
session.setAttribute("randStr", randStr);
g.setColor(Color.black);
g.setFont(new Font("",Font.PLAIN,20));
g.drawString(randStr, 10, 17);
for(int i=0;i<100;i++){
int x = rnd.nextInt(width);
int y = rnd.nextInt(height);
g.drawOval(x, y, 1, 1);
}
ImageIO.write(image, "JPEG", response.getOutputStream());
out.clear();
out = pageContext.pushBody();
%>
chengji.jsp
<%@ page language="java" import="java.util.*" pageEncoding="gb2312"%>
<html>
<body>
<script>
function sm1() {
document.form1.action = "neizhuye.jsp";
document.form1.submit();
}
function sm2() {
document.form1.action = "xuanke.jsp";
document.form1.submit();
}
function sm3() {
document.form1.action = "chengji.jsp";
document.form1.submit();
}
function sm4() {
document.form1.action = "pingjia.jsp";
document.form1.submit();
}
function sm5() {
document.form1.action = "zhuyemian.jsp";
document.form1.submit();
}
</script>
<body>
<form name="form1" method="post">
<table border="8" borderColor="#51a8ff" width="100%" height="100%"
bgColor="#ecf5ff">
<tr>
<td align="right" height="11%"
style="background:url('image/06.jpg') no-repeat;" colspan="5"><input
type="button" onclick="sm5()" value="退出">
</td>
</tr>
<tr>
<td bgColor="#c8e3ff" style="color:blue" height="3%" width="12.5%"
align="center" onclick="sm1()">返回首页</td>
<td bgColor="#c8e3ff" style="color:blue" height="3%" width="12.5%"
align="center" onclick="sm2()">课程安排</td>
<td bgColor="#c8e3ff" style="color:blue" height="3%" width="12.5%"
align="center" onclick="sm3()">成绩查询</td>
<td bgColor="#c8e3ff" style="color:blue" height="3%" width="12.5%"
align="center" onclick="sm4()">教师评价</td>
<td bgColor="#c8e3ff" height="3%" width="50%"></td>
</tr>
<tr>
<td height="5%" colspan="5" style="color:red"><img
src="image/004.png">当前位置-----------成绩查询</td>
</tr>
<tr>
<td height="81%" colspan="8" valign="top">
<table height="10%" width="100%" bgColor="#f7ffff">
<tr>
<td width="12%">学年: <select name="xuenian">
<option>20##-2013</option>
<option>20##-2014</option>
</select></td>
<td width="10%">学期: <select name="xueqi">
<option>1</option>
<option>2</option>
</select></td>
<td width="90%"><input type="button" value="查询"></td>
</tr>
</table>
<table height="90%" width="100%" border="2" bordercolor="blue"
bgColor="#eeeff">
<tr>
<td align="center" height="20%" width="25%">课程号</td>
<td align="center" height="20%" width="25%">课程名</td>
<td align="center" height="20%" width="25%">成绩</td>
<td align="center" height="20%" width="25%">任课老师</td>
</tr>
<tr>
<td align="center" height="20%" width="25%"></td>
<td height="20%" width="25%"> </td>
<td height="20%" width="25%"> </td>
<td height="20%" width="25%"> </td>
</tr>
<tr>
<td align="center" height="20%" width="25%"></td>
<td height="20%" width="25%"> </td>
<td height="20%" width="25%"> </td>
<td height="20%" width="25%"> </td>
</tr>
<tr>
<td align="center" height="20%" width="25%"></td>
<td height="20%" width="25%"> </td>
<td height="20%" width="25%"> </td>
<td height="20%" width="25%"> </td>
</tr>
<tr>
<td align="center" height="20%" width="25%"></td>
<td height="20%" width="25%"> </td>
<td height="20%" width="25%"> </td>
<td height="20%" width="25%"> </td>
</tr>
</table></td>
</tr>
</table>
</body>
</html>
neizhuye.jsp
<%@ page language="java" import="java.util.*" pageEncoding="gb2312"%>
<html>
<body>
<script>
function sm1() {
document.form1.action = "neizhuye.jsp";
document.form1.submit();
}
function sm2() {
document.form1.action = "xuanke.jsp";
document.form1.submit();
}
function sm3() {
document.form1.action = "chengji.jsp";
document.form1.submit();
}
function sm4() {
document.form1.action = "pingjia.jsp";
document.form1.submit();
}
function sm5() {
document.form1.action = "zhuyemian.jsp";
document.form1.submit();
}
</script>
<body>
<form name="form1" method="post">
<table border="8" borderColor="#51a8ff" width="100%" height="100%"
bgColor="#ecf5ff">
<tr>
<td align="right" height="11%"
style="background:url('image/06.jpg') no-repeat;" colspan="5"><input
type="button" onclick="sm5()" value="退出">
</td>
</tr>
<tr>
<td bgColor="#c8e3ff" style="color:blue" height="3%" width="12.5%"
align="center" onclick="sm1()">返回首页</td>
<td bgColor="#c8e3ff" style="color:blue" height="3%" width="12.5%"
align="center" onclick="sm2()">课程安排</td>
<td bgColor="#c8e3ff" style="color:blue" height="3%" width="12.5%"
align="center" onclick="sm3()">成绩查询</td>
<td bgColor="#c8e3ff" style="color:blue" height="3%" width="12.5%"
align="center" onclick="sm4()">教师评价</td>
<td bgColor="#c8e3ff" height="3%" width="50%"></td>
</tr>
<tr>
<td height="5%" colspan="5" style="color:red"><img
src="image/004.png">当前位置-----------首页</td>
</tr>
<tr>
<td height="81%" colspan="8" align="center" style="font-size:100px;">欢迎使用教务管理系统</td>
</tr>
</table>
</body>
</html>
xuanke.jsp
<%@ page language="java" import="java.util.*" pageEncoding="gb2312"%>
<html>
<body>
<script>
function sm1() {
document.form1.action = "neizhuye.jsp";
document.form1.submit();
}
function sm2() {
document.form1.action = "xuanke.jsp";
document.form1.submit();
}
function sm3() {
document.form1.action = "chengji.jsp";
document.form1.submit();
}
function sm4() {
document.form1.action = "pingjia.jsp";
document.form1.submit();
}
function sm5() {
document.form1.action = "zhuyemian.jsp";
document.form1.submit();
}
</script>
<body>
<form name="form1" method="post">
<table border="8" borderColor="#51a8ff" width="100%" height="100%"
bgColor="#ecf5ff">
<tr>
<td align="right" height="11%"
style="background:url('image/06.jpg') no-repeat;" colspan="5"><input
type="button" onclick="sm5()" value="退出">
</td>
</tr>
<tr>
<td bgColor="#c8e3ff" style="color:blue" height="3%" width="12.5%"
align="center" onclick="sm1()">返回首页</td>
<td bgColor="#c8e3ff" style="color:blue" height="3%" width="12.5%"
align="center" onclick="sm2()">课程安排</td>
<td bgColor="#c8e3ff" style="color:blue" height="3%" width="12.5%"
align="center" onclick="sm3()">成绩查询</td>
<td bgColor="#c8e3ff" style="color:blue" height="3%" width="12.5%"
align="center" onclick="sm4()">教师评价</td>
<td bgColor="#c8e3ff" height="3%" width="50%"></td>
</tr>
<tr>
<td height="5%" colspan="5" style="color:red"><img
src="image/004.png">当前位置-----------课程安排</td>
</tr>
<tr>
<td height="81%" align="center" colspan=5 style="font-size:50px;">
<a href="/haitao/servlet/serdownload?file=kebiao.jpg">下载此课程表 </a> <br>
<img src="image/kebiao.jpg"></td>
</tr>
</table>
</body>
</html>