當(dāng)前位置：
首頁 >
JS 倒计时定时器
發(fā)布時間：2023/12/14
34
豆豆
JS 60秒倒計時代碼
<!DOCTYPE html> <html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>倒計時定時器</title> </head><style>.main {display: flex;flex-direction: row;justify-content: center;align-items: center;}#timer {width: 100px;} </style><body><div class="main"><div id="timer"></div><a href="javascript:;" id="startBtn">開始</a></div><script>let startBtn = document.getElementById('startBtn');let timerNode = document.getElementById('timer');let senond = 0function timer() {startBtn.style = "display:none";senond = 60;timerNode.innerText = senond;let promise = new Promise((resolve, reject) => {let setTimer = setInterval(() => {senond--;timerNode.innerText = senond;console.log(senond);if (senond <= 0) {resolve(setTimer);startBtn.style = "display:block";}}, 1000);});promise.then((setTimer) => {clearInterval(setTimer);});}startBtn.addEventListener('click', timer, false);</script> </body></html>總結(jié)
- 上一篇： Linux虚拟机不显示IP地址解决方法（
- 下一篇： JS 位数不够自动左补0