頁面登錄-短信驗證碼+倒計時

頁面:

<tr> <td>手機號:</td>
             <td><input style="margin:0px 0px 20px 82px;" name="tel" id="tel" /></td></tr>
 <tr><td>驗證碼:</td>
            <td><input style="margin:0px 0px 20px 82px;" name="jym" id="jym"></td>
            <td><input type="button" value="獲取短信驗證碼" οnclick="captcha(this)"></button></td>

方法:

//var值用來保存短信驗證碼

var verifyCode;

//做了簡單的手機號碼驗證
function captcha(obj){
      var tel = $("#tel").val();
      var myreg=/^[1][3,4,5,7,8,9][0-9]{9}$/;
      if (!myreg.test(tel)) {
          alert("請填寫正確的手機號碼")
          return false;
      }
      settime(obj);

//ajax向後臺發送請求
      var url = "../Action/TellCheck/T";
        verifyCode = doAjax({async: false, url: url, data:{tel : tel}});
}

 

public String exec(HttpServletRequest request, HttpServletResponse response) {
            String tell = request.getParameter("tel");
              JSONObject json=null;
            //生成6位驗證碼
              int verifyCode = (int)((Math.random()*9+1)*1000);
            //發送短信
            boolean flag = sendSMS(tell, String.valueOf(verifyCode));
            //如果發送成功向前端返回生成的驗證碼

if(flag == true){
                return String.valueOf(verifyCode);
            }else{
                return "@@Error";
            }      
   }

public boolean sendSMS(String mobilelist, String message) {
    String info = null;
    boolean b =false;
    try{
        HttpClient httpclient = new HttpClient();
        PostMethod post = new PostMethod("https://api.ums86.com:9600/sms/Api/Send.do?");//
        post.getParams().setParameter(HttpMethodParams.HTTP_CONTENT_CHARSET,"gbk");
        post.addParameter("SpCode", "");
        post.addParameter("LoginName", "");
        post.addParameter("Password", "");
        post.addParameter("MessageContent", "驗證碼爲"+message+"爲了您的信息安全，請妥善保管，短信驗證碼有效時間爲10分鐘！");
        post.addParameter("UserNumber", mobilelist);
        post.addParameter("SerialNumber", "");
        post.addParameter("ScheduleTime", "");
        post.addParameter("ExtendAccessNum", "");
        post.addParameter("f", "1");
        httpclient.executeMethod(post);
        info = new String(post.getResponseBody(),"gbk");
        if(info.indexOf("result=0")>=0){
            b=true;
        }else{
            b=false;
        }
    }catch (Exception e) {
        e.printStackTrace();
    }
    return b;
}

 

//獲取按鈕倒計時
function settime(obj) {
     if (countdown == 0) {
        obj.removeAttribute("disabled");    
         obj.value="獲取短信驗證碼";
         countdown = 60;
         return;
     } else {
         obj.setAttribute("disabled", true);
        obj.value="重新發送(" + countdown + ")";
         countdown--;
     }
     setTimeout(function() { settime(obj) },1000)
}

 

下面是後臺: