网页实时显示服务器时间和javscript自运行时钟
内容导读
互联网集市收集整理的这篇技术教程文章主要介绍了网页实时显示服务器时间和javscript自运行时钟，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含4080字，纯文字阅读大概需要6分钟。
内容图文
最近项目网页需要实时显示服务器时间，如果每秒通过ajax加载服务器时间的话，就会产生大量的请求。 于是设计了“javscript自运行时钟” 和 "ajax加载服务器时间" 相结合的形式来显示服务器时间。“javscript自运行时钟” 以某初始时间为起点自动运行，"ajax加载服务器时间" 每60s将服务器的时间给“javscript自运行时钟” 更新。
javscript自运行时钟：
代码如下:
输出
/*!
* File: sc_clock.js
* Version: 1.0.0
* Author: LuLihong
* Date: 2014-06-06
* Desc: 自动运行的时钟
*
* 版权：开源，随便使用，请保持头部。
*/
/**
* 格式化
* @returns
*/
String.prototype.format = function() {
var args = arguments;
return this.replace(/\{(\d+)\}/g, function(m, i){return args[i];});
};
/**
* 转化为数字
* @returns
*/
String.prototype.toInt = function(defaultV) {
if (this === "" || !(/^\d+$/.test(this))) return defaultV;
return parseInt(this);
};
window.scClock =
{
year : 2014,
month : 1,
day : 1,
hour : 0,
minute : 0,
second : 0,
isRunning : false,
/**
* 显示时间的函数，调用者在调用startup函数时传入。
*/
showFunc : function(){},
/**
* 初始化
*/
init : function(y, mon, d, h, min, s){
this.year = y;
this.month = mon;
this.day = d;
this.hour = h;
this.minute = min;
this.second = s;
},
/**
* 初始化时间：时间格式：2014-06-09 11:30:30
*/
updateTime : function(time) {
var arr = time.split(/[\-\ \:]/);
if (arr.length != 6) return;
this.year = arr[0].toInt(2014);
this.month = arr[1].toInt(1);
this.day = arr[2].toInt(1);
this.hour = arr[3].toInt(0);
this.minute = arr[4].toInt(0);
this.second = arr[5].toInt(0);
},
/**
* 更新时间：时间格式：2014-06-09 11:30:30
*/
updateTime : function(time) {
var arr = time.split(/[\-\ \:]/);
if (arr.length != 6) return;
this.year = arr[0].toInt(2014);
this.month = arr[1].toInt(1);
this.day = arr[2].toInt(1);
this.hour = arr[3].toInt(0);
this.minute = arr[4].toInt(0);
this.second = arr[5].toInt(0);
},
/**
* 开始
*/
startup : function(func) {
if (this.isRunning) return;
this.isRunning = true;
this.showFunc = func;
window.setTimeout("scClock.addOneSec()", 1000);
},
/**
* 结束
*/
shutdown : function() {
if (!this.isRunning) return;
this.isRunning = false;
},
/**
* 获取时间
*/
getDateTime : function() {
var fmtString = "{0}-{1}-{2} {3}:{4}:{5}";
var sMonth = (this.month < 10) ? ("0" + this.month) : this.month;
var sDay = (this.day < 10) ? ("0" + this.day) : this.day;
var sHour = (this.hour < 10) ? ("0" + this.hour) : this.hour;
var sMinute = (this.minute < 10) ? ("0" + this.minute) : this.minute;
var sSecond = (this.second < 10) ? ("0" + this.second) : this.second;
return fmtString.format(this.year, sMonth, sDay, sHour, sMinute, sSecond);
},
/**
* 增加一秒
*/
addOneSec : function() {
this.second++;
if (this.second >= 60) {
this.second = 0;
this.minute++;
}
if (this.minute >= 60) {
this.minute = 0;
this.hour++;
}
if (this.hour >= 24) {
this.hour = 0;
this.day++;
}
switch(this.month) {
case 1:
case 3:
case 5:
case 7:
case 8:
case 10:
case 12: {
if (this.day > 31) {
this.day = 1;
this.month++;
}
break;
}
case 4:
case 6:
case 9:
case 11: {
if (this.day > 30) {
this.day = 1;
this.month++;
}
break;
}
case 2: {
if (this.isLeapYear()) {
if (this.day > 29) {
this.day = 1;
this.month++;
}
} else if (this.day > 28) {
this.day = 1;
this.month++;
}
break;
}
}
if (this.month > 12) {
this.month = 1;
this.year++;
}
this.showFunc(this.getDateTime());
if (this.isRunning)
window.setTimeout("scClock.addOneSec()", 1000);
},
/**
* 检测是否为闰年: 判断闰年的规则是，能被4整除，但能被100整除的不是闰年，能被400整除为闰年.
*/
isLeapYear : function() {
if (this.year % 4 == 0) {
if (this.year % 100 != 0) return true;
if (this.year % 400 == 400) return true;
}
return false;
}
};
调用代码：
代码如下:
/**
* 开始系统时间
*/
function startupClock() {
if (window.scClock) {
window.scClock.startup(function(time){
$("#currTime").text(time);
});
}
}
/**
* 加载系统时间
*/
function loadSystemTime() {
var jsonData = {
"ajaxflag": 1,
"mod": "time_mod"
};
$.getJSON(ajax_sc_url, jsonData, function(data){
if (data.code==0) {
if (window.scClock)
window.scClock.updateTime(data.time);
}
});
setTimeout("loadSystemTime()", 60000);
}
html显示代码：
代码如下:
<span id="currTime"></span>
内容总结
以上是互联网集市为您收集整理的网页实时显示服务器时间和javscript自运行时钟全部内容，希望文章能够帮你解决网页实时显示服务器时间和javscript自运行时钟所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。
内容备注
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。
内容手机端
扫描二维码推送至手机访问。
来源：【匿名】