JS登陆与注册验证

<%@ page contentType="text/html; charset=UTF-8" language="java" pageEncoding = "UTF-8"%>
<%@ taglib uri="/WEB-INF/struts-logic.tld" prefix="logic"%>

<script type="text/javascript">
    //邮箱验证
    function checkEmail()
    {
     var email=document.logonForm.userid.value;
     var emailError=document.getElementById("emailerror");
     var d=email.indexOf("@");
     var v=email.indexOf(".");
    
     if(d==-1||v==-1||(v-d)<=1||email.charAt(0)=="@"||v==email.length-1)
     {
      emailError.innerHTML="邮箱格式不正确！";
     }
    else
     {
      emailError.innerHTML="";
     }
    }   
   
     //密码验证
    function checkpwd()
    {
     var pwdError=document.getElementById("pwdError");
     var pwd=document.logonForm.password.value;
   
     if(pwd.length<6 || pwd.length>16)
     {
     pwdError.innerHTML="密码应为6--16个字符！";
    
     }
     else
     {
     pwdError.innerHTML="";
     }
    }   

</script>

<form method="post" name="logonForm"  action="<%=request.getContextPath()%>/logon.do">
 <div align="center">
  <h2>
   用户登录
  </h2>
  <br />
  <logic:notEmpty   name= "logonerror"   scope= "request">
            <a><span class="fade"><%=request.getAttribute("logonerror") %></span></a>        
        </logic:notEmpty>
  <div>
   邮 箱：
   <input type="text" id="userid" value="" name="userid" size="36"
    maxLength="36" οnblur="checkEmail()"/>
  </div>
  <a><span class="fade" id="emailError"></span></a>
  <br />
  <div>
   密 码：
   <input type="password" id="password" value="" name="password"
    size="38" maxLength="16" οnblur="checkpwd()"/>    
  </div>
  <a><span class="fade" id="pwdError"></span></a>
  <br />
  <h2></h2>
  <div>
      <input type="Submit" name="submit"  style="width: 210px" value="登录"/>
   
  </div>
 </div>
</form>
=====================================================================================

=====================================================================================

 

<%@ page contentType="text/html; charset=UTF-8"%>
<%@ taglib uri="/WEB-INF/struts-logic.tld" prefix="logic"%>

<script type="text/javascript">
    //邮箱验证
    function checkEmail()
    {
     var email=document.registerform.userid.value;
     var emailError=document.getElementById("emailerror");
     var d=email.indexOf("@");
     var v=email.indexOf(".");
     if(d==-1||v==-1||(v-d)<=1||email.charAt(0)=="@"||v==email.length-1)
     {
      emailError.innerHTML="邮箱格式不正确！";
     }
    else
     {
      emailError.innerHTML="";
     }
    }   
   
     //密码验证
    function checkpwd()
    {
     var pwdError=document.getElementById("pwdError");
     var pwd=document.registerform.password.value;
   
     if(pwd.length<6 || pwd.length>16)
     {
     pwdError.innerHTML="密码应为6--16个字符！";
    
     }
     else
     {
     pwdError.innerHTML="";
     }
    }
   
    //重复密码验证
    function checkpwd_cf()
    {
     var pwd_cfError=document.getElementById("pwd_cfError");
     var pwd=document.registerform.password.value;
     var pwd_cf=document.registerform.password_cf.value;
   
     if(pwd!=pwd_cf)
     {
     pwd_cfError.innerHTML="两次输入的密码不一致！";
     }
     else
     {
     pwd_cfError.innerHTML="";
     }
    }
</script>

<!--注册框架-->
<form action="<%=request.getContextPath()%>/regist.do" method="post" name="registerform">
 <div align="center">

  <h2>
   注册信息
  </h2>
   
     <logic:notEmpty   name= "registerror"   scope= "request">
            <a><span class="fade"><%=request.getAttribute("registerror") %></span></a>        
        </logic:notEmpty>
  <div>
   <span class="atten">*</span>邮箱地址：
   <input type="text" name="userid" id="userid" value=""
    size="36" maxLength="36" οnblur="checkEmail()"/>
  </div>
  <a><span class="fade" id="emailError"></span></a>
  <br />
  <div>
   <span class="atten">*</span>输入密码：
   <input type="password" name="password" id="password" value=""
    size="38" maxLength="16" οnblur="checkpwd()"/>
  </div>
  <a><span class="fade" id="pwdError"></span></a>
  <br />
  <div>
   <span class="atten">*</span>重复密码：
   <input type="password" name="password_cf" id="password_cf" value=""
    size="38" maxlength="16" οnblur="checkpwd_cf()"/>
  </div>
        <a><span class="fade" id="pwd_cfError"></span></a>
  <br />
  <h2>
   基本信息
  </h2>
  <div>
   性 别：&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
   <input name="gender" type="radio"  value="男" checked="checked" />&nbsp;男&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
   <input type="radio" id="gender" name="gender" value="女" />
   &nbsp; 女
  </div>
  <br />

  <div class="name_list font_space fleft">
   年 龄：
   <select id="age" name="age" style="width: 235px;">
    <option>
     <=15岁
    </option>
    <option>
     16-18岁
    </option>
    <option>
     19-22岁
    </option>
    <option selected>
     23-27岁
    </option>
    <option>
     16-18岁
    </option>
    <option>
     28-33岁
    </option>
    <option>
     34-40岁
    </option>
    <option>
     41-50岁
    </option>
    <option>
     >=51岁
    </option>
   </select>
  </div>

  <br />
  <div>
   学 历：
   <select id="education" name="education" style="width: 235px;">
    <option>
     初中/初中以下
    </option>
    <option>
     高中/中专/技校
    </option>
    <option>
     大专
    </option>
    <option selected>
     本科
    </option>
    <option>
     硕士
    </option>
    <option>
     博士/博士以上
    </option>
   </select>
  </div>
  <br />
  <div>
   职 业：
   <select id="occupation" name="occupation" style="width: 235px;">
    <option>
     学生
    </option>
    <option>
     科学家
    </option>
    <option>
     作家
    </option>
    <option>
     教育工作者
    </option>
    <option>
     律师
    </option>
    <option>
     其它
    </option>
   </select>
  </div>
  <br />
  <div>
   省 份：
   <select id="address" name="address" style="width: 235px;">
    <option>
     北京市
    </option>
    <option>
     天津市
    </option>
    <option>
     河北省
    </option>
    <option>
     山西省
    </option>
    <option>
     内蒙古自治区
    </option>
    <option>
     辽宁省
    </option>
    <option>
     吉林省
    </option>
    <option>
     黑龙江省
    </option>
    <option>
     上海市
    </option>
    <option>
     江苏省
    </option>
    <option>
     浙江省
    </option>
    <option>
     安徽省
    </option>
    <option>
     福建省
    </option>
    <option>
     江西省
    </option>
    <option>
     山东省
    </option>
    <option>
     河南省
    </option>
    <option>
     湖北省
    </option>
    <option>
     湖南省
    </option>
    <option>
     广东省
    </option>
    <option>
     广西壮族自治区
    </option>
    <option>
     海南省
    </option>
    <option>
     重庆市
    </option>
    <option>
     四川省
    </option>
    <option>
     贵州省
    </option>
    <option>
     云南省
    </option>
    <option>
     西藏自治区
    </option>
    <option>
     陕西省
    </option>
    <option>
     甘肃省
    </option>
    <option>
     青海省
    </option>
    <option>
     宁夏回族自治区
    </option>
    <option>
     新疆维吾尔自治区
    </option>
    <option>
     台湾省
    </option>
    <option>
     香港特别行政区
    </option>
    <option>
     澳门特别行政区
    </option>
   </select>
  </div>
  <br />
  <h2></h2>
  <div class="buttons">
   <input class="button_next" style="width: 210px" name="submit"
    type="submit" value="注册账号" />
  </div>
 </div>
</form>

转载于:https://www.cnblogs.com/xrxiaolong/articles/2693832.html