码迷,mamicode.com
首页 > Web开发 > 详细

JS实现动态显示当前时间

时间:2016-02-23 15:48:11      阅读:241      评论:0      收藏:0      [点我收藏+]

标签:

效果图:

技术分享

代码实现:

 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>

 

JS实现动态显示当前时间

标签:

原文地址:http://www.cnblogs.com/Steven-shi/p/5210045.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!