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改內容為重發驗證碼。