jQuery 前端實現手機驗證碼

標籤：erro   .ajax   htm   col   js代碼   驗證碼   資料格式   button   isa   

html

<input id="phone" type="text" name="phone"><input id="checkCode"  type="text"  name="code"><button id="code-btn">點擊發送驗證碼</button>

 

js代碼

var code = ""; //接收驗證碼   $(‘#code-btn‘).click(function(){  var count = 5;    var phone=$("#phone").val();//手機號碼      var reg_phone = /1\d{10}/;    if(!reg_phone.test(phone)){   //驗證手機是否符合格式        alert("填寫手機號");        return false;    }     //開始計時      $("#code-btn").attr(‘disabled‘,‘disabled‘);      $("#code-btn").html("倒計時" + count + "秒");      var timer = setInterval(function(){        count--;      $("#code-btn").html("倒計時" + count + "秒");       if (count==0) {        clearInterval(timer);        $("#code-btn").attr("disabled",false);//啟用按鈕          $("#code-btn").html("重新發送驗證碼");        code = "";//清除驗證碼。如果不清除，過時間後，輸入收到的驗證碼依然有效       }    },1000);    //向後台發送處理資料      $.ajax({          type: "POST", //用POST方式傳輸          dataType: "text", //資料格式:JSON          url: ‘‘, //目標地址          data: "phone=" + phone + "&code=" + code,          error: function (XMLHttpRequest, textStatus, errorThrown) { },          success: function (msg){ }      });});  

 

jQuery 前端實現手機驗證碼