通过Jquery实现验证码倒计时功能

HTML标签

<button class="btn-primary getVerification">获取验证码</button>

Jquery代码

这里遇到了一点问题：

只能使用setInerval，不能使用setTimeout,因为setTimeout只能在规定时间内执行一次，而setInterval是在每隔规定时间内执行一次。

// 获取验证码 实现计时器功能
$('.getVerification').click(function () {
  var timer = 60;
  let setTimer=setInterval(()=>{
    getTime();
  }, 1000)
  
  function getTime () {
    if (timer === 0) {
      timer = 60;
      $('.getVerification').text("发送验证码");
      $('.getVerification').removeAttr("disabled");
      $('.getVerification').css('width', '121px');
      $('.yanzhengmaInput').css('width', '200px');
      clearInterval(setTimer);
    } else {
      $('.getVerification').css('width', '40px');
      $('.getVerification').text(timer);
      $('.getVerification').attr("disabled",true);
      $('.yanzhengmaInput').css('width', '281px');
      timer--;
    }
    // console.log(timer);
  }
})

clearInterval(setTimer); 清除定时器，大大节省了内存空间...