注册页面:
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <style> span{ display:inline-block; width:120px;font:bold 20px '楷体';} #d1{ text-align: center;} </style> </head> <body style="background-image:url(img/1.jpg);background-size: cover;padding: 0;margin: 0"> <div id="d1" style="color: white;"> <h2 style="color:gray; font:italic bold 36px '楷体';background: #fff1ff;border: 1px #fff1ff solid;width: 40%;margin: auto;">注册页面</h2> <form action="register.jsp" method="post" style="margin:5px 0 0 5px;"> <p><span>姓名:</span><input type="text" name="userName" placeholder="请输入姓名" required pattern="[\u4E00-\u9FA5A-Za-z]+"/></p> <p><span>手机号:</span><input type="text" name="userPhone" placeholder="请输入手机号" required="required" pattern="1[34578]\d{9}"/></p> <p><span>密码:</span><input type="password" name="userPwd" required placeholder="长度为6-16个字符" pattern="[a-zA-Z0-9]{6,16}" /></p> <p><span>邮箱:</span><input type="email" name="userEmail" placeholder="请输入正确邮箱" required="required" pattern="\w[-\w.+]*@([A-Za-z0-9][-A-Za-z0-9]+\.)+[A-Za-z]{2,14}"/></p> <p><span>性别:</span> <input type="radio" name="sex" value="男"/>男 <input type="radio" name="sex" value="女"/>女 </p> <p><span>兴趣爱好:</span> <input type="checkbox" name="hobby" value="篮球"/>篮球 <input type="checkbox" name="hobby" value="看书"/>看书 <input type="checkbox" name="hobby" value="看电影"/>看电影 <input type="checkbox" name="hobby" value="LOL"/>LOL </p> <p><span>出生日期:</span> <input type="date" name="date" /> </p> <p style="text-align: center;"> <input type="submit" value="提交" Style="border-radius: 26%;color: blue; height: 55px;width: 90px;font-size: 36px;font-family: '楷体'"/> <input type="reset" value="重置" Style="border-radius: 26%;color: blue;"/> </p> </form> </div> <div> <img alt="" src="img/3.jpg" width="35%" style="margin:o;opacity: 0.3;"> </div> </body> </html>
页面效果:
接受页面:
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body style="background-image: url(img/2.jpg);padding: 0;margin: 0;text-align: center;font:bold 36px '楷体';color: red; "> <h1 style="color: blue">用户注册信息</h1> <%request.setCharacterEncoding("UTF-8"); %> <%String username=request.getParameter("userName"); %> <P><%out.print("用户名:"+username); %><P/> <%String userPwd=request.getParameter("userPwd"); %> <p><%out.print("用户密码:"+userPwd); %><p/> <%String userEmail=request.getParameter("userEmail"); %> <p><%out.print("用户邮箱:"+userEmail); %><p/> <%String userSex = request.getParameter("sex"); %> <p><%out.print("用户性别:"+userSex); %><p/> <%String[] hobbys=request.getParameterValues("hobby"); %> <p>兴趣爱好: <%if(hobbys!=null){ for(String hobby:hobbys){ out.print(hobby+"\t"); } } %> </p> <P>出生日期:<%String birthday=request.getParameter("date"); %> <%=birthday %> <P/> </body> </html>
页面效果: