最近、プロジェクトのWebページでは、サーバー時間をリアルタイムで表示する必要があります。サーバー時間が1秒あたりのAjaxを介してロードされると、多数のリクエストが生成されます。
したがって、「Javscriptセルフランニングクロック」と「Ajaxロードサーバー時間」の組み合わせが、サーバー時間を表示するように設計されました。 「Javscriptセルフランニングクロック」は、特定の初期時間から開始点として自動的に実行されます。Ajaxロードサーバー時間」は、サーバー時間を60秒ごとに「Javscriptセルフランニングクロック」に更新します。
javscript自己実行時計:
コードコピーは次のとおりです。
/*!
*ファイル:sc_clock.js
*バージョン:1.0.0
*著者:ルリホン
*日付:2014-06-06
* DESC:自動的に実行されます
*
*著作権:オープンソース、好きなように使用してください。頭を維持してください。
*/
/**
*フォーマット出力
* @returns
*/
string.prototype.format = function(){
var args = arguments;
this.replace(// {(/d+)/}/g、function(m、i){return args [i];});
};
/**
*数字に変換します
* @returns
*/
string.prototype.toint = function(defaultV){
if(this === "" ||!(/^/d+$/。test(this)))return defaultV;
parseintを返す(this);
};
window.scclock =
{
年:2014年、
月:1、
日:1、
時間:0、
分:0、
2番目:0、
Isrunning:false、
/**
*スタートアップ関数を呼び出すときに発信者によって渡された時間を表示する関数。
*/
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);
}、
/**
* 始める
*/
スタートアップ:function(func){
if(this.isrunning)return;
this.isrunning = true;
this.showfunc = func;
window.settimeout( "scclock.addonesec()"、1000);
}、
/**
* 仕上げる
*/
シャットダウン:function(){
if(!this.isrunning)return;
this.isrunning = false;
}、
/**
*時間を取得します
*/
getDateTime:function(){
var fmtstring = "{0} - {1} - {2} {3}:{4}:{5}";
varmonth =(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);
}、
/**
* 1秒を追加します
*/
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){
ケース1:
ケース3:
ケース5:
ケース7:
ケース8:
ケース10:
ケース12:{
if(this.day> 31){
this.day = 1;
this.month ++;
}
壊す;
}
ケース4:
ケース6:
ケース9:
ケース11:{
if(this.day> 30){
this.day = 1;
this.month ++;
}
壊す;
}
ケース2:{
if(this.isleapyear()){
if(this.day> 29){
this.day = 1;
this.month ++;
}
} else if(this.day> 28){
this.day = 1;
this.month ++;
}
壊す;
}
}
if(this.month> 12){
this.month = 1;
this.year ++;
}
this.showfunc(this.getDateTime());
if(this.isrunning)
window.settimeout( "scclock.addonesec()"、1000);
}、
/**
* LEAP年かどうかの検出:LEAP年を判断するためのルールは、それを4で割ることができるが、100で割ることができるが、LEAP年になるために400で割ることができる。
*/
ISLEAPYEAR:function(){
if(this.year%4 == 0){
if(this.year%100!= 0)trueを返します。
if(this.year%400 == 400)trueを返します。
}
falseを返します。
}
};
コールコード:
コードコピーは次のとおりです。
/**
*システム時間を開始します
*/
function startupclock(){
if(window.scclock){
window.scclock.startup(function(time){
$( "#currime")。text(time);
});
}
}
/**
*システム時間の読み込み
*/
関数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);
}
});
setimeout( "LoadSystemTime()"、60000);
}
HTML表示コード:
コードコピーは次のとおりです。
<span id = "currime"> </span>