一、实验目的:
通过编程和上机实验理解 JSP各个页面之间的响应和传递的过程。并且能够熟练的掌握JSP的内置对象的属性和方法,并能灵活运用。
二、实验环境:
Eclipse
三、实验内容:
(写出主要的内容)
1. 基础练习:内置对象常用方法的使用。
2. 编写获取表单数据。
3. 按照要求实现简单注册、登录程序。
(1) regist.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>register.jsp</title>
<style>
.aaa{
text-align-last:justify;
display: inline-block;
width: 80px;
}
.bbb{
align:center;
margin-top:20px;
}
.ccc{
background-color:pink;
display: block;
align:center;
width: 400px;
height: 400px;
margin-left: 80px;
margin-top: 50px;
border:1px solid #000;
}
.ddd{
background-color: rgba(208,162,63,1.00);
}
</style>
</head>
<body>
<article class="ccc">
<h3>用户注册</h3>
<p>欢迎注册您的相关信息,请您如实填写</p>
<form action="Rmessge.jsp" method="post">
<div class="bbb">
<label class="aaa" for="userName">用户姓名: </label>
<input type="text" name="username" id="username" placeholder="请输入用户名"> <br/>
</div>
<div class="bbb">
<label class="aaa" for="userphone" placeholder="请输入手机号">手机号码:</label>
<input type="tel" name="userphone" pattern="^1\d{10}$"><br/>
</div>
<div class="bbb">
<label class="aaa" for="email">邮箱地址:</label>
<input type="email" required name="email" ><br/>
</div>
<div class="bbb">
<label class="aaa" for="pwd">密码: </label>
<input type="password" name="password" id="pwd" placeholder="请输入密码"> <br/>
</div>
<div class="bbb">
<label class="aaa" for="userName">确认密码: </label>
<input type="password" name="password1" id="pwd1" placeholder="再次输入密码"/> <br/>
</div>
<div class="bbb">
<input type="checkbox" checked / >我同意<a href="#">相关协议和政策</a><br />
</div>
<div class="bbb">
<input class="ddd" type="submit" value="提交" />
<input class="ddd" type="reset" />
</div>
</form>
</article>
</body>
</html>
(2)Rmessge.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>Rmessge.jsp</title>
<style>
.ccc{
background-color:pink;
display: block;
align:center;
width: 400px;
height: 300px;
margin-left: 80px;
margin-top: 50px;
border:1px solid #000;
}
</style>
</head>
<body >
<%request.setCharacterEncoding("utf-8");%>
<%
String name = (String)request.getParameter("username");
String pwd = (String)request.getParameter("password");
String pwd1 = (String)request.getParameter("password1");
String email = (String)request.getParameter("email");
String phone = (String)request.getParameter("userphone");
session.setAttribute("username",name);
session.setAttribute("password",pwd);
session.setAttribute("password1",pwd1);
session.setAttribute("email",email);
session.setAttribute("userphone",phone);
if(!pwd.equals(pwd1)){
out.print("注册失败,两次密码不一致"+"<br>");
out.print("5秒后跳转回index界面注册");
response.setHeader("refresh","5;regist.jsp");
}
else if(pwd.equals("")||name.equals("")){
out.print("注册失败,用户为空或者密码为空"+"<br>");
out.print("5秒后跳转回index界面注册");
response.setHeader("refresh","5;regist.jsp");
}
else{
out.print("恭喜注册成功"+"<br>");
}
%>
<div class="ccc">
<h2 class="h2">注册成功!</h2>
<h3 class="h3">以下是您的注册信息,请记住您的信息!</h3>
<form class="form" action="regist.jsp" method="get">
<span>您的用户:<%=name%></span><br />
<span>密码:<%=pwd%></span><br />
<span>邮箱:<%=email%></span><br />
<span>电话号码:<%=phone%></span><br />
<span><a href="./login.jsp">返回登录</a></span>
</form>
</div>
</body>
</html>
(3) login.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">
<!DOCTYPE html>
<html><head>
<meta charset="UTF-8">
<title> Login.jsp</title>
<style>
.aaa{
text-align-last:justify;
display: inline-block;
width: 80px;
}
.bbb{
align:center;
margin-top:20px;
font-size: large;
}
.ccc{
background-color:skyblue;
display: block;
align:center;
width: 400px;
height: 300px;
margin-left: 80px;
margin-top: 50px;
border:1px solid #000;
}
.ddd{
background-color: rgba(194,143,33,0.92);
}
</style>
</head>
<body>
<h3>我的账户</h3>
<section class="ccc">
<h3>请登录...</h3>
<h4>登录</h4>
<form action="Lmessge.jsp" method="post">
<div class="bbb">
<label class="aaa">用户名:</label>
<input type="text" name="username" placeholder="请输入用户名" />
</div>
<br />
<div class="bbb">
<label class="aaa">密码:</label>
<input type="password" name="password" placeholder="请输入密码"/>
</div>
<br />
<div class="bbb">
<input type="checkbox" value="记住用户名" checked />记住用户名
</div>
<br />
<div class="bbb">
<input class="ddd" type="submit" name="login" value="login" />
</div>
<br />
</form>
</section>
</body>
</html>
(4) Lmessge.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>Lmessge.jsp</title>
<style>
.ccc{
background-color:skyblue;
display: block;
align:center;
width: 400px;
height: 300px;
margin-left: 80px;
margin-top: 50px;
}
</style>
</head>
<body class="ccc">
<%request.setCharacterEncoding("utf-8");%>
<%
String name = request.getParameter("username") ;
String pwd = request.getParameter("password") ;
if("3182052051518".equals(pwd)&&"LLM".equals(name))
out.println("登录成功!");
else {
out.println("登录失败!请重新登录!");
}
%>
</body>
</html>