現在時刻を刻々と表示する

ここ
<script type="text/javascript">
var gDateJSObj;
function viewDate(){
	gDateJSObj = new DateJS();
	gDateJSObj.dspDateTime('KOKO');	// 引数の'KOKO'に出力する
}
function hiddenDate(){
	gDateJSObj.stopDateTime();	// タイマーをストップ
	var DateElement = getEl("KOKO");
	DateElement.innerHTML = "ここ！";	// 表示を書き換え
}
</script>

ここでは、prototype.jsを利用してnew演算子でオブジェクトを生成しコントロールします。

  • Class.createを使うときは、オブジェクト生成時にinitialize()が実行されます。ここで、メンバを初期化します。
  • DateJS.dspDateTime(element)では、divタグなどに付与したID文字列を渡します 。
<script type="text/javascript" src="/AJAX/prototype.js" charset="utf-8"></script>
<script type="text/javascript">
var DateJSBase = {
    Version: '2.0.0',
    Description: '日付・時刻を刻々と表示する、日付を元に画像の表示/非表示'
};
//----------------------------------------------
// prototype.js 
var DateJS = Class.create(DateJSBase, {
    Version: '2.2.a',
    _date: {},               // テンポラリ用オブジェクト
    // コンストラクタ
    initialize: function() {
        this.DateTimeCount=0;
        this.intervalDateTimeID=0;
    },
    //--------------------------------
    // 日時を指定したエレメントに表示する（１秒ごとに書き換える）
    dspDateTime: function (element) {
        element = getEl(element);
        if (typeof element == 'null')   return;
        this._getDateTime(element);
        if (AugusAjax.Browser.Trident){
            // IE の場合は、第三引数以降が利用できないので、無名関数で、呼び出せばよい
            this.intervalDateTimeID = setInterval(function () { this._getDateTime(element); }.bind(this),999);
        }
        else
            this.intervalDateTimeID = setInterval(this._getDateTime.bind(this), 999, element);
        return;
    },
    _getDateTime: function (element) {
        // １時間経過したら停止する
        if (this.DateTimeCount++ >= 3600000) {  // 60*60*1000
            this.stopDateTime ();
            alert(gAlertStr[0]);
        }
        this._date.now = new Date();
        $HTML(element, this._date.now.YMDtmsJP ());
        delete this._date.now;
    },
    stopDateTime: function () {
        clearInterval (this.intervalDateTimeID);
    }
});
// End of DateJS

//  $HTML(element,str)     getElementById(element).innerHTML = str;

</script>
TOPへ

TOPへ
ようこそオーガスの窓へ

IT用語辞典


inserted by FC2 system