JS实现动态显示当前时间
效果图:
代码实现:
1 <script language="JavaScript"> 2 var timerID = null; 3 var timerRunning = false; 4 function stopclock() { 5 if (timerRunning) 6 clearTimeout(timerID); 7 timerRunning = false; 8 } 9 function startclock() { 10 stopclock(); 11 showtime(); 12 } 13 function showtime() { 14 var now = new Date(); 15 var year = now.getFullYear(); 16 var month = now.getMonth() + 1; 17 var day = now.getDate(); 18 var hours = now.getHours(); 19 var minutes = now.getMinutes(); 20 var seconds = now.getSeconds() 21 var timeValue = "系统时间: " + year + "-" + ((month >= 10) ? month : "0" + month) + "-" + ((day >= 10) ? day : "0" + day) + " "; 22 23 timeValue += ((hours < 10) ? "0":"")+hours 24 timeValue += ((minutes < 10) ? ":0" : ":") + minutes 25 timeValue += ((seconds < 10) ? ":0" : ":") + seconds 26 document.clock.thetime.value = timeValue; 27 timerID = setTimeout("showtime()", 1000); 28 timerRunning = true; 29 } 30 31 </script>
1 <form name="clock" style="float:right;width:360px;padding-top:5px;"> 2 <span style="vertical-align: central;"> 3 <input name="thetime" size="30" style="font-size: 14px; background-color: transparent; border: 0; color: #49d1fe ; font-weight: 600; "> 4 </span> 5 </form>