|
|
@@ -0,0 +1,159 @@
|
|
|
+<%@ page contentType="text/html;charset=UTF-8" language="java" %>
|
|
|
+<!DOCTYPE html>
|
|
|
+<html>
|
|
|
+<head>
|
|
|
+<meta charset="UTF-8">
|
|
|
+<title>成员注册页面注册页面</title>
|
|
|
+ <%--静态包含：base标签，css样式，js脚本--%>
|
|
|
+ <%@ include file="/pages/common/head.jsp"%>
|
|
|
+ <script type="text/javascript">
|
|
|
+ //页面加载之后
|
|
|
+ $(function (){
|
|
|
+ //验证用户名是否可用
|
|
|
+ $("#username").blur(function (){
|
|
|
+ var username = this.value();
|
|
|
+
|
|
|
+ $.getJSON("http://localhost:8089/TestServlet09_war_exploded/userServlet",
|
|
|
+ "action=ajaxExistsUsername&username=" + username,
|
|
|
+ function (data){
|
|
|
+ if (data.existsUsername){
|
|
|
+ $("span.errorMsg").text("用户名已存在");
|
|
|
+ }else {
|
|
|
+ $("span.errorMsg").text("用户名可用");
|
|
|
+
|
|
|
+ }
|
|
|
+ });
|
|
|
+ });
|
|
|
+
|
|
|
+ //验证码切换
|
|
|
+ $("#code_img").click(function () {
|
|
|
+ // 在事件响应的 function 函数中有一个 this 对象。这个 this 对象，是当前正在响应事件的 dom 对象
|
|
|
+ // src 属性表示验证码 img 标签的 图片路径。它可读，可写
|
|
|
+ // alert(this.src);
|
|
|
+ this.src = "${basePath}kaptcha.jpg?d=" + new Date();
|
|
|
+ });
|
|
|
+
|
|
|
+ //给注册绑定单机事件
|
|
|
+ $("#sub_btn").click(function () {
|
|
|
+ /*
|
|
|
+ 验证用户名，由字母数字下划线组成，长度5-12
|
|
|
+ 验证密码：由字母数字下划线组成，长度5-12
|
|
|
+ 验证确认密码，与密码一致
|
|
|
+ 邮箱验证，xxxxx@xxx.com
|
|
|
+ 验证码：只需验证用户有输入
|
|
|
+ */
|
|
|
+ //验证用户名，由字母数字下划线组成，长度5-12
|
|
|
+ var usernameText = $("#username").val();
|
|
|
+ var usernameAdd="admin";
|
|
|
+ var usernamePatt = /^\w{5,12}$/;
|
|
|
+ if (!usernamePatt.test(usernameText)){
|
|
|
+ $("span.errorMsg").text("用户名格式错误");
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ if (usernameText.toLowerCase().indexOf('admin') !== -1){
|
|
|
+ $("span.errorMsg").text("用户名命名错误");
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ //验证密码：由字母数字下划线组成，长度5-12
|
|
|
+ var passwordText = $("#password").val();
|
|
|
+ var passwordPatt = /^\w{5,12}$/;
|
|
|
+ if (!passwordPatt.test(passwordText)){
|
|
|
+ $("span.errorMsg").text("密码格式错误");
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ //验证确认密码，与密码一致
|
|
|
+ var repwdText = $("#repwd").val();
|
|
|
+ if (repwdText != passwordText){
|
|
|
+ $("span.errorMsg").text("请与密码保持一致");
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ //邮箱验证，xxxxx@xxx.com
|
|
|
+ var emailText = $("#email").val();
|
|
|
+ var emailPatt = /^[a-z\d]+(\.[a-z\d]+)*@([\da-z](-[\da-z])?)+(\.{1,2}[a-z]+)+$/;
|
|
|
+ if (!emailPatt.test(emailText)){
|
|
|
+ $("span.errorMsg").text("邮箱格式错误");
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ //验证码：只需验证用户有输入
|
|
|
+ var codeText = $("#code").val();
|
|
|
+ //去掉验证码的空格
|
|
|
+ codeText = $.trim(codeText);
|
|
|
+ if (codeText == null || codeText == ""){
|
|
|
+ $("span.errorMsg").text("验证码不能为空");
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+
|
|
|
+ $("span.errorMsg").text("");
|
|
|
+ });
|
|
|
+ });
|
|
|
+ </script>
|
|
|
+<style type="text/css">
|
|
|
+ .login_form{
|
|
|
+ height:420px;
|
|
|
+ margin-top: 25px;
|
|
|
+ }
|
|
|
+
|
|
|
+</style>
|
|
|
+</head>
|
|
|
+<body>
|
|
|
+ <div id="login_header">
|
|
|
+ <img class="logo_img" alt="" src="" >
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="login_banner">
|
|
|
+
|
|
|
+ <div id="l_content">
|
|
|
+ <span class="login_word">欢迎注册</span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div id="content">
|
|
|
+ <div class="login_form">
|
|
|
+ <div class="login_box">
|
|
|
+ <div class="tit">
|
|
|
+ <h1>注册成为会员</h1>
|
|
|
+ <span class="errorMsg">
|
|
|
+<%-- <%=request.getAttribute("msg")==null?"":request.getAttribute("msg")%>--%>
|
|
|
+ ${requestScope.msg}
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ <div class="form">
|
|
|
+ <form action="userServlet" method="post">
|
|
|
+ <input type="hidden" name="action" value="regist">
|
|
|
+ <label>用户名称：</label>
|
|
|
+ <input class="itxt" type="text" placeholder="请输入用户名"
|
|
|
+ value="${requestScope.username}"
|
|
|
+ autocomplete="off" tabindex="1" name="username" id="username"/>
|
|
|
+ <br />
|
|
|
+ <br />
|
|
|
+ <label>用户密码：</label>
|
|
|
+ <input class="itxt" type="password" placeholder="请输入密码" autocomplete="off" tabindex="1" name="password" id="password" />
|
|
|
+ <br />
|
|
|
+ <br />
|
|
|
+ <label>确认密码：</label>
|
|
|
+ <input class="itxt" type="password" placeholder="确认密码" autocomplete="off" tabindex="1" name="repwd" id="repwd" />
|
|
|
+ <br />
|
|
|
+ <br />
|
|
|
+ <label>电子邮件：</label>
|
|
|
+ <input class="itxt" type="text" placeholder="请输入邮箱地址"
|
|
|
+ value="${requestScope.email}"
|
|
|
+ autocomplete="off" tabindex="1" name="email" id="email" />
|
|
|
+ <br />
|
|
|
+ <br />
|
|
|
+ <label>验证码：</label>
|
|
|
+ <input class="itxt" type="text" name="code" style="width: 80px;" id="code"/>
|
|
|
+ <img alt="" src="kaptcha.jpg" style="float: right; margin-right: 40px; width: 110px;height: 30px" id="code_img">
|
|
|
+ <br />
|
|
|
+ <br />
|
|
|
+ <input type="submit" value="注册" id="sub_btn" />
|
|
|
+
|
|
|
+ </form>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <%--静态包含：页脚--%>
|
|
|
+ <%@include file="/pages/common/footer.jsp"%>
|
|
|
+</body>
|
|
|
+</html>
|
