用户找回密码功能JS验证邮箱通过点击下一步隐藏邮箱输入框并修改下一步按钮的ID

//这里是BaseDao

 1     /**
 2      * 获得一个对象
 3      * @param hql
 4      * @param param
 5      * @return
 6      */
 7     public Object get(String hql, Object[] param){
 8         List<Object> objects = this.getHibernateTemplate().find(hql, param);  
 9         if (objects != null && objects.size() > 0) {  
10             return objects.get(0);  
11         } else {  
12             return null;  
13         }
14     }

//这里是UsersDaoImpl

 1     /**
 2      * 查找邮箱返回数量
 3      */
 4     public Integer CheckEmail(String email) {
 5         StringBuilder sb=new StringBuilder();
 6         sb.append("Select count(*) From Users where email='");
 7         if(StringUtils.isNotBlank(email)){
 8             sb.append(email);
 9         }
10         sb.append("'");
11         Long s=(Long) super.getCount(sb.toString());
12         return s.intValue();
13     }
14     
15     /**
16      * 根据邮箱查看返回一个对象
17      */
18     public Users FindByEmail(String email) {
19         String hql = "From Users where email =?";
20         return (Users) super.get(hql, new Object[]{email});
21     }
22 
23     
24     /**
25      * 修改密码
26      */
27     public void UpdatePassByEmail(Users user) {
28         super.Update(user);
29         
30     }
31     
32     

//这里是UserAction

 1     public String checkEmail() throws IOException{
 2         HttpServletResponse response = ServletActionContext.getResponse();
 3         response.setContentType("text/html;charset=UTF-8");
 4         PrintWriter out = response.getWriter();
 5         message = "邮箱不存在";
 6         if(StringUtils.isNotBlank(email)){
 7             Integer count=userBiz.CheckEmail(email);
 8             if(count<=0){
 9                 message="邮箱不存在";
10             }else{
11                 message="";
12             }
13         }
14         
15         out.print(message);
16         out.flush();
17         out.close();
18         
19         return SUCCESS;
20         
21     }
22     
23     public String UpdatePassByEmail() throws IOException{
24         HttpServletResponse response = ServletActionContext.getResponse();
25         response.setContentType("text/html;charset=UTF-8");
26         PrintWriter out = response.getWriter();
27         message = "修改失败";
28         boolean falg=false;
29         
30         if(StringUtils.isNotBlank(email)){
31             if(StringUtils.isNotBlank(Password)){
32                 if(StringUtils.isNotBlank(sure_password)){
33                     if(!sure_password.equals(Password)){
34                         falg=false;
35                         message="密码不一致";
36                     }else{
37                         
38                         Users u=userBiz.FindByEmail(email);
39                         u.setPassword(MD5Util.EncryptionMD5(sure_password));
40                         userBiz.UpdatePassByEmail(u);
41                         falg=true;
42                         if(falg==true){
43                             message="修改成功";
44                         }else{
45                             message="修改失败";
46                         }
47                     }
48                 }
49             }
50         }
51         out.print(message);
52         out.flush();
53         out.close();
54         return SUCCESS;
55         
56     }

//这里是HTML页面

 1         <div id="login-content" class="clearfix">
 2 
 3             <form  method="post">
 4                 <fieldset id="filedset1">
 5                     <div class="control-group">
 6                         <label class="control-label" for="email">请输入注册时的邮箱</label>
 7                         <div class="controls">
 8                             <input type="text" name="email" id="email"
 9                                 onblur="Onblur()" />
10                         </div>
11                         <span style="color: red" id="message"></span>
12                     </div>
13                 </fieldset>
14                 
15                 <fieldset id="filedset2" hidden="hidden">
16                     <div class="control-group">
17                         <label class="control-label" for="password">Password</label>
18                         <div class="controls">
19                             <input type="password" name="Password" id="password" onblur="RepassOnblur()"/>
20                         </div>
21                     </div>
22                                         
23                     <div class="control-group">
24                         <label class="control-label" for="sure_password">Sure_Password</label>
25                         <div class="controls">
26                             <input type="password" name="sure_password" id="sure_password" onblur="RepassOnblur()"/>
27                         </div>
28                         <span style="color: red" id="messages"></span>
29                     </div>
30                 </fieldset>
31                 
32                 
33                 <div class="pull-right">
34                     <button type="button" id="Next" class="btn btn-warning btn-large">
35                         下一步
36                     </button>
37                 </div>
38             </form>
39 
40         </div>

//这里是JS代码

  1 /**
  2  * 这里是验证邮箱输入框事件
  3  */
  4 function Onblur(){
  5     var Email = $("#email").val();
  6     var EmailReg = /^([a-zA-Z0-9_-]{1,11})@([a-zA-Z0-9]{2,4}|126|163|189).([a-zA-Z0-9]{2,3})$/;
  7     
  8     if (Email.length == 0) {
  9         $("#message").html("邮箱不能为空");
 10         $("#Next").attr("disabled",true);
 11         return;
 12     } else if (!EmailReg.test(Email)) {
 13         $("#message").html("邮箱格式不正确      例:123456@126.com");
 14         $("#Next").attr("disabled",true);
 15         return;
 16     } else {
 17         $.ajax({
 18             type:"POST",
 19             dataType:"text",
 20             url:"checkEmail",
 21             data:{
 22                 "email":Email
 23             },
 24             success:function(data){
 25                 
 26                 if(data==""){
 27                     $("#message").html("");
 28                     $("#Next").attr("disabled",false);
 29                     
 30                 }else{
 31                     $("#message").html(data);
 32                     $("#Next").attr("disabled",true);
 33                 }
 34             },
 35             error:function(){
 36                 alert("通讯有问题,请稍候尝试...");
 37             }
 38         });
 39         
 40     }
 41 }
 42 
 43 /**
 44  * 点击下一步按钮事件
 45  * 隐藏邮箱输入框,显示密码输入框
 46  * 修改下一步按钮ID
 47  */
 48 $(function(){
 49     $("body").on("click","#Next",function(){
 50         $("#filedset1").hide();
 51         $("#filedset2").removeAttr("hidden");
 52         $("#Next").attr("id","Fix");
 53     });
 54     
 55     $("body").on("click","#Fix",function(){
 56         var Password = $("#password").val();
 57         var SurePassword = $("#sure_password").val();
 58         
 59         $.ajax({
 60             type:"POST",
 61             dataType:"text",
 62             url:"UpdatePassByEmail",
 63             data:{
 64                 "Password":Password,
 65                 "sure_password":SurePassword
 66             },
 67             success:function(data){
 68                 alert(data);
 69             },
 70             error:function(){
 71                 alert("通讯有问题,请稍候尝试...");
 72             }
 73         });
 74     });
 75 });
 76 
 77 /**
 78  * 验证密码输入框事件
 79  */
 80 function RepassOnblur(){
 81     var Password = $("#password").val();
 82     var SurePassword = $("#sure_password").val();
 83     
 84     if (Password.length == 0) {
 85         $("#messages").html("密码不能为空");
 86         $("#Fix").attr("disabled",true);
 87         return false;
 88     } else if (Password.length < 6 || Password.length > 16) {
 89         $("#messages").html("密码长度小于6位或大于16位");
 90         $("#Fix").attr("disabled",true);
 91         return false;
 92     } else {
 93         $("#messages").html("");
 94         $("#Fix").attr("disabled",true);
 95     }
 96     
 97     if (SurePassword.length == 0) {
 98         $("#messages").html("确认密码不能为空");
 99         $("#Fix").attr("disabled",true);
100         return false;
101     } else if (SurePassword.length < 6 || SurePassword.length > 16) {
102         $("#messages").html("密码长度小于6位或大于16位");
103         $("#Fix").attr("disabled",true);
104         return false;
105     } else if (SurePassword != Password) {
106         $("#messages").html("密码不一致");
107         $("#Fix").attr("disabled",true);
108         return false;
109     } else {
110         $("#messages").html("");
111         $("#Fix").attr("disabled",false);
112     }
113 }
原文地址:https://www.cnblogs.com/HYXJavaweb/p/4444024.html