使用javascript做時間倒數(shù)讀秒功能的實例

更新時間：2019年01月23日 08:37:42 作者：chenqiangdage

今天小編就為大家分享一篇關(guān)于使用javascript做時間倒數(shù)讀秒功能的實例，小編覺得內(nèi)容挺不錯的，現(xiàn)在分享給大家，具有很好的參考價值，需要的朋友一起跟隨小編來看看吧

某個試卷在線考試需要讀秒。網(wǎng)上找了一會就是沒找到我想要的。只好自己改改網(wǎng)上的，這也用用，那也用用。

其他代碼不貼了。貼相關(guān)的：

html頁面代碼：

<a class="btn btn-default" onclick="StartExamine();">開始</a> 
<div id="TimeClock" class="col-md-4" ><span class="text-danger hour">00</span> <span class="text-danger minute">00</span> <span class="text-danger seconds">00</span></div>

作為一個顯示倒數(shù)的div層

javascript 代碼：

 var gEaminePapeId = 'dfdfad33434342';
    var gExaminePapeTime = '100';    
    var gHour = gExaminePapeTime / 60;    
    var gMinute = gExaminePapeTime % 60; 
    var gSeconds = gExaminePapeTime * 60;
    var hour_elem = $("#TimeClock").find('.hour');
    var minute_elem = $("#TimeClock").find('.minute');
    var second_elem = $("#TimeClock").find('.seconds');
    function StartExamine() { 
      //開始計時      
      var timeClik = setInterval('ShowClock()', 1000);
   }
   function ShowClock() {    
     if (gSeconds > 1) {
       gSeconds -= 1;
       var hour = Math.floor((gSeconds / 3600) % 24);
       var minute = Math.floor((gSeconds / 60) % 60);
       var second = Math.floor(gSeconds % 60);
       $(hour_elem).text(hour < 10 ? "0" + hour+":" : hour+":"); //計算小時
       $(minute_elem).text(minute < 10 ? "0" + minute+":" : minute+":"); //計算分鐘
       $(second_elem).text(second < 10 ? "0" + second : second); //計算秒殺
     }
     else {
       clearInterval(timeClik);
       //做題時間到
        ForceSubmit();
     }
   }   
    function ForceSubmit() {
      //強制提交答題
  }

總結(jié)

以上就是這篇文章的全部內(nèi)容了，希望本文的內(nèi)容對大家的學習或者工作具有一定的參考學習價值，謝謝大家對腳本之家的支持。如果你想了解更多相關(guān)內(nèi)容請查看下面相關(guān)鏈接

您可能感興趣的文章:

js
倒計時

相關(guān)文章

PHP自動加載autoload和命名空間的應用小結(jié)
PHP的自動加載就是我們加載實例化類的時候，不需要手動去寫require來導入這個class.php文件，程序自動幫我們加載導入進來這.篇文章主要介紹了PHP自動加載autoload和命名空的應用,需要的朋友可以參考下
2017-12-12
自己編寫的類似JS的trim方法
在這里我們可以使用自己編寫的trim方法來處理一些剪掉字符串兩端的空字符串的需要，下面有個不錯的方法，感興趣的朋友可以參考下
2013-10-10
多瀏覽器兼容的動態(tài)加載 JavaScript 與 CSS
Omar AL Zabir這位MVP總是喜歡搞些稀奇古怪同時又很實用的小東西，并且還十分值得參考。最近他就做了一個叫做ensure的小工具用于動態(tài)加載JavaScript、CSS與HTML，而且IE、Firefox、Opera、Safari都支持了，那么我們就來看看ensure是如何做到動態(tài)加載JavaScript與CSS的。
2008-09-09
基于javascript實現(xiàn)的購物商城商品倒計時實例
本文主要介紹了基于javascript實現(xiàn)的購物商城商品倒計時實例，代碼詳細，可直接復制試試看效果。需要的朋友可以參考借鑒
2016-12-12
Echarts柱狀圖修改柱子顏色漸變及柱子圓角效果實例
在ECharts中,可以通過修改series.itemStyle.normal屬性來定制柱狀圖的柱子樣式,包括圓角和背景色漸變,文中通過代碼介紹的非常詳細,需要的朋友可以參考下
2024-09-09
echarts實現(xiàn)中國地圖下鉆進入下一級(地圖鉆取)
最近在學習echarts,今天就來介紹一下echarts實現(xiàn)中國地圖下鉆進入下一級,具有一定的參考價值,感興趣的可以了解一下
2023-08-08
通過onmouseover選項卡實現(xiàn)img圖片的變化
這篇文章主要介紹了通過onmouseover選項卡實現(xiàn)img圖片的變化,需要的朋友可以參考下
2014-02-02
使用 Jest 和 Supertest 進行接口端點測試實例詳解
這篇文章主要介紹了使用 Jest 和 Supertest 進行接口端點測試,結(jié)合實例形式詳細分析了使用 Jest 和 Supertest 進行接口端點測試具體原理、操作技巧與相關(guān)注意事項,需要的朋友可以參考下
2020-04-04
javascript隨機將第一個dom中的圖片添加到第二個div中示例
此代碼的是一個簡單的例子，將第一個div中的五張圖片中，提取隨機兩張顯示到第二個div中，具體實現(xiàn)如下，感興趣的朋友可以參考下
2013-10-10
JavaScript設(shè)計模式組合設(shè)計模式案例
這篇文章主要介紹了JavaScript設(shè)計模式組合設(shè)計模式案例，組合設(shè)計模式是用于將多個部分通過組合的方式行成一個整體，更多相關(guān)內(nèi)容需要的小伙伴可以參考一下
2022-06-06