Home >Web Front-end >JS Tutorial >A small program that displays the clock based on the server time as a starting point_javascript skills

A small program that displays the clock based on the server time as a starting point_javascript skills

WBOYOriginal: 2016-05-16 18:51:332080browse

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

我在做OA的一个考勤程序时，要动态显示服务器的时间，让员工知道当前是否可以下班，而客户机由于种种原因时间与服务器并不一致，所以不能用上面的代码，改进了一下：

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

最后加上一个meizz的格式化函数（略有修正），最终版如下：

<span id="curTime"></span> 
<script type="text/javascript"><!--

// 页面要开始计时的日期（一般是服务器日期）,比如2007-01-12 11:34:55开始计时 
var beginAdd = new Date(2007,0,12,11,34,55); 
var beginDate = new Date(); 
    function abc() { 
     var now = new Date(); 
     var diff = (now - beginDate); 
     beginAdd.setMilliseconds(beginAdd.getMilliseconds() + diff); 
     beginDate = now; 
document.getElementById("curTime").innerHTML = beginAdd.format("yyyy年MM月dd日 hh:mm:ss 星期W"); 
} 
    setInterval("abc();",1000);

Date.prototype.format = function(format) { 
     var obj = 
     { 
     "M+": this.getMonth() + 1, //返回实际月份 
     "d+": this.getDate(), //返回当月第几天 
     "h+": this.getHours(), //返回小时 
     "m+": this.getMinutes(), //返回分钟 
     "s+": this.getSeconds(), //返回秒 
     "q+": Math.floor((this.getMonth() + 3) / 3), //返回第几个季度 
     "S": this.getMilliseconds(), //返回毫秒 
     "w": this.getDay(), //返回星期几，0为星期日 
     "W": "日一二三四五六".charAt(this.getDay()) //返回星期几的中文表示 
     }

// 年的单独处理 
     if (/(y+)/.test(format)) 
     format = format.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length)); 
     // 其它格式处理 
     for (var k in obj) { 
     if (new RegExp("(" + k + ")").test(format)) 
     format = format.replace(RegExp.$1, RegExp.$1.length == 1 ? obj[k] : ("00" + obj[k]).substr(("" + obj[k]).length)); 
     } 
     return format; 
    } 
// --></script>

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：js operation css implementation code_javascript skillsNext article：js operation css implementation code_javascript skills

See more

A small program that displays the clock based on the server time as a starting point_javascript skills

Related articles