點擊按鈕倒計時


點擊后 倒計時5秒, 5秒后恢復。

  <input type="button" value="獲取驗證碼"></button> 
 var btn = document.querySelector('input');         // 點擊事件 btn.onclick = function () { //點擊按鈕時,按鈕禁用
            btn.disabled = true; // 倒計時5秒
            var index = 5; // 按鈕文字為獲取驗證碼(5)
            btn.value = `獲取驗證碼 (${index}) `; // 定時器,延遲 1s
            var timer = setInterval(function () { // 倒計時 --,值也跟着改變
                index--; btn.value = `獲取驗證碼 (${index}) `; // 當倒計時等等為0時
                if (index == 0) { // 停止計時
 clearInterval(timer); // 按鈕禁用取消
                btn.disabled = false; // 將文字值重置為獲取驗證碼
                btn.value = '獲取驗證碼'; } }, 1000)        
              //setInterval 一次性定時器


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM