JS實現十分鐘倒計時代碼實例
更新時間：2018年10月18日 08:36:39 投稿：laozhang
在本篇文章里我們給大家分享了關于JS實現十分鐘倒計時的相關實例代碼，有需要的朋友們可以學習下。
編寫JS倒計時代碼需要用到很多JavaScript知識，比如：if函數，Math.floor，定時器setInterval等等，如有不清楚的小伙伴可以參考PHP中文網的相關文章，或者訪問 JavaScript視頻教程。
舉例：10分鐘考試倒計時，當時間僅剩五分鐘時，提醒考試僅剩5分鐘，時間結束時，提示考試結束。具體代碼如下：
HTML部分：
<body> <div id="timer"></div> <div id="warring"></div> </body>
JavaScript部分：
<script type="text/javascript">
var maxtime = 10 * 60; //
function CountDown() {
if (maxtime >= 0) {
minutes = Math.floor(maxtime / 60);
seconds = Math.floor(maxtime % 60);
msg = "距離結束還有" + minutes + "分" + seconds + "秒";
document.all["timer"].innerHTML = msg;
if (maxtime == 5 * 60)alert("距離結束僅剩5分鐘");
--maxtime;
} else{
clearInterval(timer);
alert("時間到，結束!");
}
}
timer = setInterval("CountDown()", 1000);
</script>
JS十分鐘倒計時代碼的具體步驟：
1、設置考試時長maxtime = 10 * 60秒，即10分鐘
2、用if函數判斷，當maxtime大于等于零時，判斷剩余分和秒
3、再用if函數判斷，當時間僅剩5分鐘時，彈出提示：距離結束僅剩5分鐘
4、如果時間到，則清除定時器，提示：結束
效果如圖所示：
相關文章
input type=file 選擇圖片并且實現預覽效果的實例
下面小編就為大家?guī)硪黄猧nput type=file 選擇圖片并且實現預覽效果的實例。小編覺得挺不錯的，現在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-10-10
這篇文章主要介紹了JS繪圖Flot應用圖形繪制異常解決方案,文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下2020-10-10
這篇文章主要為大家詳細介紹了swiper自定義分頁器的樣式，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-09-09
這篇文章主要介紹了JavaScript ES2019中的8個新特性詳解，小編覺得挺不錯的，現在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2019-02-02
JavaScript與函數式編程解釋...2007-04-04
Flow之一個新的Javascript靜態(tài)類型檢查器
今天我們興奮的發(fā)布了 Flow 的嘗鮮版，一個新的Javascript靜態(tài)類型檢查器。Flow為Javascript添加了靜態(tài)類型檢查，以提高開發(fā)效率和代碼質量，本文給大家分享Flow之一個新的Javascript靜態(tài)類型檢查器，感興趣的朋友一起學習吧2015-12-12
這篇文章主要介紹了js設計模式之代理模式及訂閱發(fā)布模式,結合實例形式詳細分析了代理模式及訂閱發(fā)布模式的概念、原理、實現方法及相關操作注意事項,需要的朋友可以參考下2019-08-08
這篇文章主要為大家詳細介紹了JavaScript實現全選取消效果，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-12-12
為一個字符串進行URL編碼很容易,只需要調用encodeURI,傳入要編碼的字符串即可,而且實現的方法不止這一個,下面這篇文章主要給大家介紹了關于js對url進行編碼解碼的三種方式,需要的朋友可以參考下2023-02-02
2008-04-04