微信開發之小程式實現倒計時
阿新 • • 發佈:2019-01-02
setTimeout(func, time)可以使得每隔time毫秒就執行一次func函式,常用來做計時器/時鐘。
下面是在微信小程式中的使用思路,只截取了關鍵部分程式碼。
var timer; // 計時器 Page({ // ...省略 // 自定義的開始按鈕 startBtn: function () { console.log("開始按鈕"); Countdown(); }, // 自定義的暫停按鈕 pauseBtn: function () { console.log("暫停按鈕"); clearTimeout(timer); }, }); // 倒計時 function Countdown() { timer = setTimeout(function () { console.log("----Countdown----"); Countdown(); }, 1000); };
思路:
- setTimeout()延遲指定毫秒數後執行指定函式,可通過遞迴呼叫setTimeout()來實現各種計時器功能。
- 如果想做每秒鐘重新整理一次的時鐘,只需每次執行時間轉換函式並setData更新介面即可。
- 使用clearTimeout("定時器的名字")可以停下指定的計時器。
下面是Javascript關於時間的轉換函式。
// 秒數 --> 時:分:秒 function formatTime(seconds) { return [ parseInt(seconds / 60 / 60), // 時 parseInt(seconds / 60 % 60), // 分 parseInt(seconds % 60) // 秒 ] .join(":") .replace(/\b(\d)\b/g, "0$1"); }
另外,做定時重複呼叫函式的功能時,用setTimeOut()代替setInterval(),因為setInterval()是有誤差的!詳情參考
參考資料: