一. 注冊要求
1. 一個注冊頁面
- username (文本框)
- password:密碼 (密碼框)
- passwordYes :再次輸入密碼(密碼框)
- hobby (多選框)
- sex (單選框)
- info (文本域)
2. servlet處理注冊信息,判斷兩次密碼是否相同
- 相同則跳到成功頁面
- 不同則注冊失敗,重定向到注冊頁面
3. 成功頁面
- 顯示登陸成功的用戶名,密碼,愛好,性別和信息;
- 顯示一個注銷按鈕
4. 如果注銷后,或者沒登錄,不能直接進入成功頁面,跳轉到失敗界面
二. 具體操作步驟
1:在index.jsp(首頁)寫一個超鏈接,讓跳轉到注冊界面
2:寫好注冊界面后,提交給ServeltRegister處理
3:跳轉到ServletRegister注冊界面,把用戶消息放進session中,並判斷輸入的密碼是否正確
4:如果密碼成功,跳轉到成功界面,並在成功界面顯示用戶填寫的信息
5:在成功頁面設置注銷按鈕,按下注銷按鈕后,跳轉到ServletOut注銷界面
6:當用戶消息注銷后,讓其回到成功頁面,然后提示用戶未注冊或者已注銷,請先注冊
7:在提示頁面設置注冊按鈕,讓其重新注冊,回到注冊頁面
8:如果密碼輸出錯誤,讓其回到注冊頁面,並用彈框提醒
三. 代碼
1:首頁 index.jsp
<html>
<head>
<title>首頁</title>
<style>
body{
margin: 0 auto;
text-align: center;
}
</style>
</head>
<body>
<h1>首頁</h1>
<hr>
<a href="${pageContext.request.contextPath}/register.jsp">注冊</a>
</body>
</html>
2:注冊頁 register.jsp
<html>
<head>
<title>注冊</title>
<script>
var status = '${sessionScope.pwdFail}';
if (status=='yes'){
alert("兩次密碼輸入不一樣,請重新輸入")
}
</script>
</head>
<body>
<h1>注冊</h1>
<form action="${pageContext.request.contextPath}/Register" method="post">
<p>用戶名: <input type="text" name="username" required ></p>
<p>密碼:<input type="password" name="password1" required></p>
<p>確認密碼:<input type="password" name="password2" required></p>
<p>愛好:
<input type="checkbox" name="hobby" value="movie">電影
<input type="checkbox" name="hobby" value="TV">電視
<input type="checkbox" name="hobby" value="music">音樂
</p>
<p>性別:
<input type="radio" name="sex" value="boy">男
<input type="radio" name="sex" value="girl">女
</p>
<p>個人簡介:
<textarea name="info"></textarea>
</p>
<p>
<input type="submit">
<input type="reset">
</p>
</form>
</body>
</html>
3:成功頁 success.jsp
<html>
<head>
<title>注冊成功</title>
<%
HttpSession session1 = request.getSession();
if(session1.getAttribute("username")==null){
request.getRequestDispatcher("loss.jsp").forward(request,response);
}
%>
</head>
<body>
<h1>注冊成功!</h1>
<%--通過sessionScope得到信息--%>
<p> 用戶名:${sessionScope.username}</p>
<p> 密碼:${sessionScope.password1}</p>
<p> 性別:${sessionScope.sex}</p>
<p> 愛好:${sessionScope.hobbies}</p>
<p> 簡介:${sessionScope.info}</p>
<a href="${pageContext.request.contextPath}/Out">注銷</a>
</body>
</html>
4:提示頁 loss.jsp
<html>
<head>
<title>失敗</title>
</head>
<body>
<h1>
沒有session信息,未注冊或者已注銷,請先注冊
</h1>
<a href="${pageContext.request.contextPath}/register.jsp">注冊</a>
</body>
</html>
5:web.xml
<servlet>
<servlet-name>ServletRegister</servlet-name>
<servlet-class>com.sunzhen.ServletRegister</servlet-class>
</servlet>
<servlet>
<servlet-name>ServletOut</servlet-name>
<servlet-class>com.sunzhen.ServletOut</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>ServletOut</servlet-name>
<url-pattern>/Out</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>ServletRegister</servlet-name>
<url-pattern>/Register</url-pattern>
</servlet-mapping>
6:注冊 ServletRegister
request.setCharacterEncoding("utf-8");
response.setCharacterEncoding("utf-8");
//獲得用戶提交的數據
String username = request.getParameter("username");
String password1 = request.getParameter("password1");
String password2 = request.getParameter("password2");
String sex = request.getParameter("sex");
String info = request.getParameter("info");
String[] hobbies = request.getParameterValues("hobby");
if(password1.equals(password2)){
//把用戶消息放進session中
HttpSession session = request.getSession();
session.setAttribute("username",username);
session.setAttribute("password1",password1);
session.setAttribute("sex",sex);
session.setAttribute("info",info);
session.setAttribute(" hobbies", Arrays.toString(hobbies));
response.sendRedirect("success.jsp");
//request.getRequestDispatcher("success.jsp").forward(request,response);
}else {
request.getSession().setAttribute("pwdFail","yes");
response.sendRedirect("register.jsp");
}
7:注銷 ServletOut
HttpSession session = request.getSession();
//注銷session或者移除session中的數據
session.removeAttribute("username");
session.removeAttribute("password1");
session.removeAttribute("sex");
session.removeAttribute("hobbies");
session.removeAttribute("info");
response.sendRedirect("success.jsp");