网站首页  汉语字词  英语词汇  考试资料  写作素材  旧版资料

请输入您要查询的考试资料：

　

标题 Js实现手机发送验证码时按钮延迟操作
内容
    在做项目的时候，经常遇到发短信验证码的问题，这时候需要用户点完发送验证码按钮后，一段时间内不能重复点击，毕竟验证码都是收费的嘛，谁都不想浪费，那么如何实现这种功能呢？下面来分享一下。
    实例代码记录：
    <script type="text/javascript">
      function start_sms_button(obj){
        var count = 1 ;
        var sum = 30;
        var i = setInterval(function(){
          if(count > 10){
            obj.attr('disabled',false);
            obj.val('发送验证码');
            clearInterval(i);
          }else{
            obj.val('剩余'+parseInt(sum - count)+'秒');
          }
          count++;
        },1000);
      }
      $(function(){
        //发送验证码
        $('#send_sms').click(function(){
          var phone_obj = $('input[name="phone"]');
          var send_obj = $('input#send_sms');
          var val = phone_obj.val();
          if(val){
            if(IsMobile(val)){
              send_obj.attr('disabled',"disabled");
              //30秒后重新启动发送按钮
              start_sms_button(send_obj);
              $.ajax({
                url:'{#url_reset("index/sms")#}',
                data:{'mobile':val},
                dataType:'json',
                type:'post',
                beforeSend:function(){
                  show_loading_body();
                },
                complete:function(){
                  show_loading_body();
                },
                success:function(data){
                  if(data.status!=undefined && (data.status == 'ok' || data.status == 'error')){
                    showMsg(data.msg);
                  }
                }
              });
            }else{
              showMsg("手机号的格式错误");
            }
          }else{
            showMsg('手机号不能为空');
          }
        });
      });
    </script>
随便看

　

在线学习网考试资料包含高考、自考、专升本考试、人事考试、公务员考试、大学生村官考试、特岗教师招聘考试、事业单位招聘考试、企业人才招聘、银行招聘、教师招聘、农村信用社招聘、各类资格证书考试等各类考试资料。

　

Copyright © 2002-2024 cuapp.net All Rights Reserved
更新时间：2025/5/15 3:48:26