美文网首页
手机号码验证发送短信

手机号码验证发送短信

作者: guoss | 来源:发表于2017-11-20 14:30 被阅读0次
<input type="text" placeholder="输入您的手机号领取优惠券" class="share_p share_p_n" id="sharePhone" data-test="^1[3|4|5|7|8]\d{9}$" />
<div class="share_code">
 <input type="text" placeholder="输入验证码" class="share_p share_p_c" id="phonecheckCode" name="phonecheckCode">
 <input type="button" value="获取验证码" class="share_p_b" id="phoneSendCode" onClick="sendMessage()"/>
</div>
<input type="button" value="我要领取" class="share_g_m" id="share_g_s"/>
var InterValObj;//进行定时器相关操作
var count=120;//定时事件
var curCount;
*发送验证码*
function sendMessage(){
  curCount=count;
  var sharePhone=document.getElementById('sharePhone');
  var phone=$('#sharePhone').val();
  var testVal=new RegExp(sharePhone.dataset.test);//原生获取属性方法
  if(phone !=''){
   if(testVal.test(phone)){
    $('#phoneSendCode').attr('disabled',true);
    $('#phoneSendCode').val(curCount+'秒重新发送');
    InterValObj=window.setInterval(SetIntTime,1000);
    //时间戳转化
    function timest() {
      var tmp = Date.parse( new Date() ).toString();
      tmp = tmp.substr(0,10);
      return tmp;
    }
    var timeNow=timest();
      var url = "接口?phone="+phone ;
      //向后台发送数据
      $.ajax({
        type:'get',
        headers: {"Sign":timeNow},//拼接相关头部信息
        url: url,
        success:function(data){
        }
      })
    }else{
       //手机号码输入有误
    }

  }else{
   //电话号码未输入
  }
}
//定时器操作
function SetIntTime(){
  if(curCount==0){
    window.clearInterval(InterValObj);
    $('#phoneSendCode').removeAttr("disabled");
    $("#phoneSendCode").val("重新发送");
      code='';
  }else{
    curCount--;
    $("#phoneSendCode").val(curCount+'秒重新发送');
  }
 }
//验证码验证
$('#share_g_s').on('click', function () {
  var phonecheckCodeVal = $('#phonecheckCode').val();
  var phone = $('#sharePhone').val();
  if (phone == "")
  {
   //手机号码是空
    return;
  }
  if (phonecheckCodeVal == "") {
   //验证码是空
    return;
  }
  var sharePhone = document.getElementById('sharePhone');
  var testVal = new RegExp(sharePhone.dataset.test);
  if (!testVal.test(phone))
  {
    //手机号码错误
    return;
  }
  var url = 接口 + phone+验证码;
  $.ajax({
    url: url,
    type: 'get',
    success: function (data) {
    if (data.retCode == 0) {
     //成功
    } else {
    //验证码错误
    },
    error: function (msg)
    {
      alert(JSON.stringify(msg))
    }
   })
})

相关文章

网友评论

      本文标题:手机号码验证发送短信

      本文链接:https://www.haomeiwen.com/subject/avdvvxtx.html