Js实现手机发送验证码时按钮延迟操作


Posted in Javascript onJune 20, 2014

实例代码记录:

<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>
Javascript 相关文章推荐
制作特殊字的脚本
Jun 26 Javascript
javascript 单选框,多选框美化代码
Aug 01 Javascript
jquery下组织javascript代码(js函数化)
Aug 25 Javascript
jquery下动态显示jqGrid以及jqGrid的属性设置容易出现问题的解决方法
Oct 22 Javascript
地址栏传递中文参数乱码在js里用escape转码
Aug 28 Javascript
JS截取字符串常用方法详细整理
Oct 28 Javascript
jquery动态调整div大小使其宽度始终为浏览器宽度
Jun 06 Javascript
jQuery实现手机号码输入提示功能实例
Apr 30 Javascript
基于jQuery实现美观且实用的倒计时实例代码
Dec 30 Javascript
Javascript基础教程之比较null和undefined值
May 16 Javascript
微信小程序实现拍照画布指定区域生成图片
Jul 18 Javascript
vue监听用户输入和点击功能
Sep 27 Javascript
使用原生js实现页面蒙灰(mask)效果示例代码
Jun 20 #Javascript
js处理php输出时间戳对不上号的解决方法
Jun 20 #Javascript
Javascript 实现复制(Copy)动作方法大全
Jun 20 #Javascript
Blocksit插件实现瀑布流数据无限( 异步)加载
Jun 20 #Javascript
教你如何自定义百度分享插件以及bshare分享插件的分享按钮
Jun 20 #Javascript
jQuery.lazyload+masonry改良图片瀑布流代码
Jun 20 #Javascript
Node.js实现简单聊天服务器
Jun 20 #Javascript
You might like
索尼SONY SRF-S83/84电路分析和打磨
2021/03/02 无线电
单一index.php实现PHP任意层级文件夹遍历(Zjmainstay原创)
2012/07/31 PHP
PHP实现的多彩标签效果代码分享
2014/08/21 PHP
php查看网页源代码的方法
2015/03/13 PHP
浅谈laravel-admin的sortable和orderby使用问题
2019/10/03 PHP
php 输出缓冲 Output Control用法实例详解
2020/03/03 PHP
JS获取节点的兄弟,父级,子级元素的方法
2014/01/09 Javascript
SeaJS入门教程系列之完整示例(三)
2014/03/03 Javascript
javascript实现输出指定行数正方形图案的方法
2015/08/03 Javascript
JS实现部分HTML固定页面顶部随屏滚动效果
2015/12/24 Javascript
创建一个类Person的简单实例
2016/05/17 Javascript
axios全局请求参数设置,请求及返回拦截器的方法
2018/03/05 Javascript
微信小程序环境下将文件上传到OSS的方法步骤
2019/05/31 Javascript
Openlayers学习之地图比例尺控件
2020/09/28 Javascript
[52:12]FNATIC vs Infamous 2019国际邀请赛小组赛 BO2 第一场 8.16
2019/08/19 DOTA
[01:27:44]DOTA2-DPC中国联赛 正赛 PSG.LGD vs Aster BO3 第一场 1月24日
2021/03/11 DOTA
一个简单的python程序实例(通讯录)
2013/11/29 Python
详解Python中 __get__和__getattr__和__getattribute__的区别
2016/06/16 Python
python生成二维码的实例详解
2017/10/29 Python
flask框架实现连接sqlite3数据库的方法分析
2018/07/16 Python
浅谈python连续赋值可能引发的错误
2018/11/10 Python
python pexpect ssh 远程登录服务器的方法
2019/02/14 Python
Python3如何使用range函数替代xrange函数
2020/10/05 Python
Restful_framework视图组件代码实例解析
2020/11/17 Python
HTML5+CSS3模仿优酷视频截图功能示例
2017/01/05 HTML / CSS
迷你唐卡软皮鞋:Minnetonka Moccasin
2018/05/01 全球购物
实体的生命周期
2013/08/31 面试题
财务副总经理工作职责
2013/11/25 职场文书
驾驶员岗位职责
2014/01/29 职场文书
统计员岗位职责范本
2015/04/14 职场文书
校园安全教育心得体会
2016/01/15 职场文书
2019年英语版感谢信(8篇)
2019/09/29 职场文书
Python办公自动化之教你如何用Python将任意文件转为PDF格式
2021/06/28 Python
Java实现学生管理系统(IO版)
2022/02/24 Java/Android
分享node.js实现简单登录注册的具体代码
2022/04/26 NodeJs
解决Python保存文件名太长OSError: [Errno 36] File name too long
2022/05/11 Python