网页实时显示服务器时间和javscript自运行时钟
于是设计了“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(){
varargs=arguments;
returnthis.replace(/\{(\d+)\}/g,function(m,i){returnargs[i];});
};
/**
*转化为数字
*@returns
*/
String.prototype.toInt=function(defaultV){
if(this===""||!(/^\d+$/.test(this)))returndefaultV;
returnparseInt(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-0911:30:30
*/
updateTime:function(time){
vararr=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-0911:30:30
*/
updateTime:function(time){
vararr=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(){
varfmtString="{0}-{1}-{2}{3}:{4}:{5}";
varsMonth=(this.month<10)?("0"+this.month):this.month;
varsDay=(this.day<10)?("0"+this.day):this.day;
varsHour=(this.hour<10)?("0"+this.hour):this.hour;
varsMinute=(this.minute<10)?("0"+this.minute):this.minute;
varsSecond=(this.second<10)?("0"+this.second):this.second;
returnfmtString.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){
case1:
case3:
case5:
case7:
case8:
case10:
case12:{
if(this.day>31){
this.day=1;
this.month++;
}
break;
}
case4:
case6:
case9:
case11:{
if(this.day>30){
this.day=1;
this.month++;
}
break;
}
case2:{
if(this.isLeapYear()){
if(this.day>29){
this.day=1;
this.month++;
}
}elseif(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)returntrue;
if(this.year%400==400)returntrue;
}
returnfalse;
}
};
调用代码:
/**
*开始系统时间
*/
functionstartupClock(){
if(window.scClock){
window.scClock.startup(function(time){
$("#currTime").text(time);
});
}
}
/**
*加载系统时间
*/
functionloadSystemTime(){
varjsonData={
"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显示代码:
<spanid="currTime"></span>