制作一個APP或系統最基礎的是登錄界面，下面通過一個簡單的登錄注冊界面的程序，來熟練掌握Web開發的技術。
一、知識點：
1.在網頁界面獲取用戶的輸入信息
2.標簽的基本應用
3.用戶輸入結果的錯誤提示
4.在處理輸入錯誤時，對用戶的輸入結果進行保留顯示及對應錯誤欄清空。
二、標簽
<form>該標簽為表單標簽，用於形成標簽</form>
<input>該標簽為輸入標簽，具體的使用根據定義的屬性顯示，具體參考文章源代碼的注釋
<selsct>下拉框標簽</select>
三、Web內置對象的使用
1.獲取網頁用戶輸入信息request.getParameter（）；
2.轉發網頁request.getRequestDispatcher("注冊頁.jsp").forward(request, response)；
3.接收網頁轉發request.getAttribute（）；
四、源代碼解析
1.注冊頁.jsp
該文件代碼用於生成用戶輸入界面的輸入表單，並接收注冊界面.jsp文件轉發過來的錯誤處理提示。
1.1輸入表單的源代碼
1 <html> 2 <head> 3 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 4 <title>JSP Page</title> 5 </head> 6 <body> 7 <h1>個人信息</h1> 8 <form action="注冊界面.jsp"> 9 用戶：<input type="text" name="username" <%if(n!=null){%> value="<%=n%>" <%}%>/> 10 <% 11 //出錯處理 12 if(error !=null && error.equals("用戶名未輸入")) 13 { 14 out.println(error); 15 // out.println("<font color="red">"+error+"</font>"); 16 } 17 %> 18 <br> <br> 19 郵箱：<input type="text" name="email" value="123456789@qq.com"/> 20 <% 21 if(error1 !=null) 22 { 23 out.println(error1); 24 // out.println("<font color="red">"+error+"</font>"); 25 } 26 %> 27 <br> <br> 28 密碼：<input type="password" name="password"/> 29 <% 30 if(error2 !=null) 31 { 32 out.println(error2); 33 // out.println("<font color="red">"+error+"</font>"); 34 } 35 %> 36 <br><br> 37 確認密碼：<input type="password" name="password1"/> 38 <% 39 if(error3 !=null) 40 { 41 out.println(error3); 42 // out.println("<font color="red">"+error+"</font>"); 43 } 44 %> 45 <% 46 if(error4 !=null) 47 { 48 out.println(error4); 49 // out.println("<font color="red">"+error+"</font>"); 50 } 51 %> 52 <br> <br> 53 性別： 54 <input type="radio" name="sex" value="0"/>男 55 <input type="radio" name="sex" value="1"/>女 56 57 <br><br> 58 <!--復選框--> 59 愛好： 60 <input type="checkbox" name="1" value="音樂"/>音樂 61 <input type="checkbox" name="1" value="美術"/>美術 62 <input type="checkbox" name="1" value="動漫"/>動漫 63 <input type="checkbox" name="1" value="電競"/>電競 64 <input type="checkbox" name="1" value="編程"/>編程 65 <br><br> 66 <!--下拉框:--> 67 班級：<select name="class"> 68 <option value="1701班">1701班</option> 69 <option value="1702班">1702班</option> 70 <option value="1703班">1703班</option> 71 <option value="1704班">1704班</option> 72 <option value="1705班">1705班</option> 73 <option value="1706班">1706班</option> 74 <option value="1707班">1707班</option> 75 76 </select> 77 78 <br> 79 <p>個人說明：</p> 80 <textarea name="p"rows="4" cols="20">填寫個人說明</textarea> 81 <br><br> 82 <input type="reset"value="重置"> 83 <input type="submit"value="提交"> 84 <br><br> 85 </form> 86 87 </body> 88 </html>
1.1.1運行結果
1.2接收錯誤處理信息的代碼
1 <%@page import="java.net.URLEncoder"%> 2 <%@page contentType="text/html" pageEncoding="UTF-8"%> 3 <% 4 //接收 5 String error =(String)request.getAttribute("error"); 6 String error1 =(String)request.getAttribute("error1"); 7 String error2 =(String)request.getAttribute("error2"); 8 String error3 =(String)request.getAttribute("error3"); 9 String error4 =(String)request.getAttribute("error4"); 10 String n =(String)request.getAttribute("n"); 11 12 %>
2.注冊界面.jsp
該文件代碼用於輸出獲得的用戶輸入信息，並對獲取的信息進行錯誤處理，把處理結果轉發至用戶輸入界面。
2.1輸出信息頁面代碼
1 <html> 2 <head> 3 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 4 <title>JSP Page</title> 5 </head> 6 <body> 7 <h1>個人信息</h1> 8 9 用戶：<%=name%> 10 <br><br> 11 郵箱：<%=email%> 12 <br><br> 13 密碼：<%=password%> 14 <br><br> 15 確認密碼：<%=password1%> 16 <br><br> 17 班級：<%=banji%> 18 <br><br> 19 愛好：<%for(int i = 0;i<str.length;i++){%> 20 <%=str[i]%> 21 <%}%> 22 23 <br><br> 24 個人說明：<%=request.getParameter("p")%> 25 </body> 26 </html>
2.1.1運行結果
用戶界面提交信息后的顯示界面 ：
2.2錯誤處理代碼
在這里只舉出部分錯誤處理的例子，供讀者對該知識的理解。該代碼應該與注冊頁.jsp的代碼聯合，方便解讀。
1 <% 2 request.setCharacterEncoding("UTF-8"); 3 //接收用戶輸入信息 4 String n=request.getParameter("username"); 5 String p=request.getParameter("password"); 6 String p1=request.getParameter("password1"); 7 8 if(n.equals("")){ 9 request.setAttribute("error", "用戶名未輸入"); 10 request.getRequestDispatcher("注冊頁.jsp").forward(request, response); 11 } 12 else if(request.getParameter("email").equals("")) 13 { 14 //用於在出現錯誤處理時，用戶輸入的信息仍然保存，並顯示 15 request.setAttribute("n", n); 16 request.setAttribute("p", p); 17 request.setAttribute("p1", p1); 18 request.setAttribute("error1", "郵箱未輸入"); 19 request.getRequestDispatcher("注冊頁.jsp").forward(request, response); 20 21 } 22 23 else if(request.getParameter("password").equals("")) 24 { 25 request.setAttribute("n", n); 26 request.setAttribute("error2", "密碼未輸入"); 27 request.getRequestDispatcher("注冊頁.jsp").forward(request, response); 28 29 } 30 else if(request.getParameter("password1").equals("")) 31 { 32 request.setAttribute("n", n); 33 request.setAttribute("p", p); 34 request.setAttribute("error3", "確認密碼未輸入"); 35 request.getRequestDispatcher("注冊頁.jsp").forward(request, response); 36 37 } 38 else if(request.getParameter("password1")!=request.getParameter("password")) 39 { 40 request.setAttribute("n", n); 41 request.setAttribute("p", p); 42 request.setAttribute("error4", "確認密碼與密碼不一致！"); 43 request.getRequestDispatcher("注冊頁.jsp").forward(request, response); 44 } 45 46 %>
2.2.1部分運行結果如下：
用戶名未輸入：
密碼未輸入：
確認密碼未輸入：
密碼與確認密碼不一致：
3.小擴展
在程序中插入調用當前時間的函數代碼，記錄注冊的時間
3.1時間代碼
1 <% 2 // 代碼塊 3 Date date = new Date(); 4 SimpleDateFormat simpledate = new SimpleDateFormat("yyyy年MM月dd日 E HH 點mm分ss秒"); 5 String strDate = simpledate.format(date); 6 7 %>
3.2顯示時間
1 注冊時間：<%=date%> 2 <br> 3 <%=strDate%>
4.完整運行成功后的結果
