js實現從0開始計時及顯示當前時間
阿新 • • 發佈:2019-02-18
需求:
頁面點選進來,就從0開始計時,動態顯示使用者停留在該頁面的時間。
思路:
記錄使用者進入該頁面的時間(初始時間);
不斷用當前時間-初始時間=在該頁面的停留時間;
需要注意的是,應該將js函式Time()放到<body>的onload中,即頁面一載入就執行
js函式應該放在<head>標籤中
js:
<script type="text/javascript"> /* * 顯示當前時間函式 * YQ */ function Time() { var today=new Date(); var h=today.getHours(); var m=today.getMinutes(); var s=today.getSeconds(); duration(h,m,s); // add a zero in front of numbers<10 m=checkTime(m); s=checkTime(s); document.getElementById('timeshow').value=h+":"+m+":"+s; t=setTimeout('Time()',500); //暫停0.5後執行Time()函式 } /* * 個位數時補0 */ function checkTime(i) { if (i<10) {i="0" + i} return i } /* * 歷時:當前時間-開始時間 * @author YQ */ function duration(nh,nm,ns){ var beginTime = document.getElementById('beginTime').value; //獲取計時初始值 var beginT = new Array(); beginT = beginTime.split(" "); beginT = beginT[1].split(":"); var sh = Number(beginT[0]); var sm = Number(beginT[1]); var ss = Number(beginT[2]); //換算曆時 h:m:s var allS = (nh*3600+nm*60+ns)-(sh*3600+ sm*60 +ss); var dh = parseInt(allS/3600); var dm = parseInt((allS-dh*3600)/60); var ds = allS - dh*3600 - dm*60; document.getElementById('duration').value = dh+':'+dm+':'+ds; } </script>
html:
<body onload="Time()">
<b>歷時:</b><input type="text" id="duration" style="border:0px;background-color:transparent;width:80px;" />
<b>當前時間:</b><input type="text" id="timeshow" style="border:0px;background-color:transparent;width:80px;" />
</body>