如何在數據插入數據庫後啓動秒錶？

Question

我有一個自己運行正常的秒錶代碼。我試圖在用戶衝入時啓動並顯示它，以便計算時間並在用戶衝出時停止。我想用這些數據然後插入數據庫。我會怎麼做呢？

<?php if($timedata['is_clocked_in'] === 'Yes'):?> 
    <h5 style="text-transform: uppercase" class="alert alert-info col-md-4">You Are Clocked In : (time count) </h5> 
    <?php elseif($timedata['is_clocked_in'] === 'No'):?> 
<button><i class="fa fa-plus" aria-hidden="true"></i> Punch In Now</button> 
    <?php endif;?> 

標記

<h1><time>00:00:00</time></h1> 
<button id="start">start</button> 
<button id="stop">stop</button> 
<button id="clear">clear</button> 

腳本

var h1 = document.getElementsByTagName('h1')[0], 
    start = document.getElementById('start'), 
    stop = document.getElementById('stop'), 
    clear = document.getElementById('clear'), 
    seconds = 0, minutes = 0, hours = 0, 
    t; 

function add() { 
    seconds++; 
    if (seconds >= 60) { 
     seconds = 0; 
     minutes++; 
     if (minutes >= 60) { 
      minutes = 0; 
      hours++; 
     } 
    } 

    h1.textContent = (hours ? (hours > 9 ? hours : "0" + hours) : "00") + ":" + (minutes ? (minutes > 9 ? minutes : "0" + minutes) : "00") + ":" + (seconds > 9 ? seconds : "0" + seconds); 

    timer(); 
} 
function timer() { 
    t = setTimeout(add, 1000); 
} 
timer(); 


/* Start button */ 
start.onclick = timer; 

/* Stop button */ 
stop.onclick = function() { 
    clearTimeout(t); 
} 

/* Clear button */ 
clear.onclick = function() { 
    h1.textContent = "00:00:00"; 
    seconds = 0; minutes = 0; hours = 0; 
} 

Answer 1

不要使用JavaScript的setTimeout的（）函數來計算秒。

我能想到的原因很多，但有兩個重要的有：

• 可靠性：你完全在訪問者的瀏覽器上的處理依賴。
• 安全性：訪問者可以輕鬆操縱您的代碼。

您可以訪問PHP，PHP可以訪問服務器的時鐘。使用它。請參閱：

http://nl1.php.net/manual/en/function.time.php

如果你必須使用JavaScript，然後使用日期對象;

https://www.w3schools.com/jsref/jsref_obj_date.asp

你被存儲時間開始，然後從停止時間減去此經過的秒數。

timePassed = stopTime - startTime 

Answer 2

你可以通過ajax實現它。

剛開始之前發送請求並調用成功狀態的停止方法。