ecshop设置密码实现邮件验证码校验功能

在ecshop后台设置邮件模板，当发送邮件时将生成的随机四位数验证码赋值模板，发送给用户。
效果如图，主要是点击发送验证码时按钮失效并触发计时器倒数事件。

前端页面
重点在JS方面

支付密码校验 与 计时器

    var reg = new RegExp(/^\d{6}$/);

     //判断密码是否为6位纯数字，不是则提醒
         jQuery("#new_pay_password").blur(function() {
              var password = jQuery("#new_pay_password").val();
              if(!reg.test(password)) {
                  document.getElementById('password_notice').style.display = "block";
                  document.getElementById('password_notice').innerHTML = pay_password_num;
              } else {
                  document.getElementById('password_notice').style.display = "none";
              }
          });
    //判断输入的两次密码是否相同，不是则提醒
          jQuery("#confirm_pay_password").blur(function() {
              var confirm_password = jQuery("#confirm_pay_password").val();
              var password = jQuery("#new_pay_password").val();
              if(confirm_password != password) {
                  document.getElementById('conform_password_notice').style.display = "block";
                  document.getElementById('conform_password_notice').innerHTML = confirm_password_invalid;
              } else {
                  document.getElementById('conform_password_notice').style.display = "none";
              }
          });

//设置计时器

          var InterValObj; //timer变量，控制时间
          var count = 60; //间隔函数，1秒执行
          var curCount;//当前剩余秒数


//点击发送验证码时将数据传给后台，发送邮件后调用返回函数触发计时器
          function send_email() {

              var status = "status="+1;
              Ajax.call('users.php?act=set_password',status,sendResponse, "GET", "JSON");
          }

          function sendResponse(result) {
              curCount = count;
              //设置button失效，开始计时
              $("#password_send_code").attr("disabled", "true");
              $("#password_send_code").val("重新发送(" + curCount + "s)");
              InterValObj = window.setInterval(SetRemainTime, 1000); //启动计时器，1秒执行一次
              alert(result.content);
          }

          function SetRemainTime() {
              if (curCount == 0) {
                  window.clearInterval(InterValObj);//停止计时器
                  $("#password_send_code").removeAttr("disabled");//启用按钮
                  $("#password_send_code").val("发送验证码");
              }
              else {
                  curCount--;
                  $("#password_send_code").val("重新发送(" + curCount + "s)");
              }
          }

在提交前对密码和验证码进行简单校验，然后提交数据后将验证码与存储在session中的邮件验证码进行校验，校验成功后就是数据库操作了,记得销毁验证码，然后反馈到前端

 Ajax.call('users.php?act=submit_psw','code='+pay_password_code+'&pay_password='+new_pay_password,setResponse, "GET", "JSON");


          function setResponse(result) {

              if(result.error == 1) {
                  alert(result.content);
                  return false;
              } else {
                  var mes = confirm(success_pay_password); // 设置成功
                  if(mes) {
                      window.location.href = 'users.php';
                  } else {
                      curCount = 0;
                      $("#password_send_code").removeAttr("disabled");//启用按钮
                      $("#password_send_code").val("发送验证码");
                      //一个小细节，设置密码后重置表单
                      $("input[type=reset]").trigger("click");

                  }
              }
          }