jQuery-验证码倒计时的实现

点击发送验证码，通常需要加入倒计时功能，HTML如下：

 <center class='block captchaArea'>
     <input class="input pwd" type="text" placeholder="请输入验证码">
     <span class="captcha">获取验证码</span>
     <span class="num"></span>
 </center>

JS如下：

 $(".captcha").click(function () {
     $(".captcha").hide()
     $(".num").show()
     var second = 30
     $(".num").text((second) + "秒")
     var interval = setInterval(function () {
         second--
         $(".num").text((second) + "秒")
         if (second === -1) {
             $(".captcha").text("重发验证码")
             clearInterval(interval)
             $(".num").hide()
             $(".captcha").show()
         }
     }, 1000)
 })

要点如下：

1.使用captcha和num分别切换显示隐藏，是为了防止captcha被再次点击，再次触发点击事件，造成倒计时混乱。

2.当second=-1时，清除定时器（clearInterval），并将captcha改内容为重发验证码。