Dragon-v

jQuery 实现按钮点击后倒计时 如短信验证码发送等

1.前端页面给一个按钮

<button type="button" class="btn-xlarge" id="dyMobileButton">发送验证</button>

2.jQuery如下

<script>
   //给按钮一个点击事件
   $('#dyMobileButton').click(function () {
     //设置时常,以秒计算
       var time=60;
    var timer = setInterval(function () {
       time--;
       if (time > 0){
         //正在倒计时
         $('#dyMobileButton').html('重新发送' + time + '');
         $('#dyMobileButton').prop('disabled',true);
       }else{
         $('#dyMobileButton').html('发送验证码');
         $('#dyMobileButton').prop('disabled',false);
         clearInterval(timer);
       }
     },1000)
   })
</script>

  注:这只是一个前台的按钮倒计时,刷新后依旧可以正常进行发送,所以要在后台再一次进行验证

posted on 2021-08-25 14:48  Dragon-v  阅读(268)  评论(0编辑  收藏  举报