javascript - 原生JS實作發送驗證碼計秒

Question

1. 現在有個問題就如題所示，我想有一個登入頁面，但是是基於遙控器的。綁定手機時需要向手機發送驗證碼，隨後按鈕的label就要隨著時間減少 60s 50s ... 0s 等 在計秒的過程中，我可能還會上下左右操作。

2. 問題是這樣，稍微了解了下 js 是單線程運行 我計秒這個 動作 和我計秒的同時進行上下左右切換焦點並行，在我理解是2個線程操作。所以 小弟不得其解，怎麼去實現呢？求高人指點。

Answer 1

開一 setInterval 跑完60秒自動解除button的disabled

跑的過程中時間累減

例如

//伪代码、思路是这样
var i = 60;
var interval;
interval = setInterval(function(){
    document.getElementById("testBtn").innerHTML(i+'s')
    i = i-1
    if(i<=0){
        clearInterval(interval)
        //解除你的btn不可点击
    }
},1000)

Answer 2

定時器是非同步執行的，定時是由另一個工作執行緒來完成的，對主執行緒不會有影響。當定時器時間到達後，會把要執行的回呼函數放到任務佇列裡，並由主執行緒來呼叫回呼函數。

所以在主執行緒上的操作不會影響定時器。

Answer 3

不用關心線程問題 setInterval可以