JavaScriptのサンプル

ページを表示してからの経過時間を表示するスクリプトです。(時・分・秒を別々のテキストフィールドに表示するタイプ)

時間

コード

<html>
<head>
<title>TAG index Webサイト</title>

<script type="text/javascript">
<!--

var start = new Date();

// 初期化
var hour = 0;
var min = 0;
var sec = 0;
var now = 0;
var datet = 0;

function disp(){

	now = new Date();

	datet = parseInt((now.getTime() - start.getTime()) / 1000);

	hour = parseInt(datet / 3600);
	min = parseInt((datet / 60) % 60);
	sec = datet % 60;

	// 数値が1桁の場合、頭に0を付けて2桁で表示する指定
	if(hour < 10) { hour = "0" + hour; }
	if(min < 10) { min = "0" + min; }
	if(sec < 10) { sec = "0" + sec; }

	// テキストフィールドにデータを渡す処理
	document.form1.field1.value = hour;
	document.form1.field2.value = min;
	document.form1.field3.value = sec;

	setTimeout("disp()", 1000);

}

// -->
</script>

</head>
<body onLoad="disp()">

<form action="#" name="form1">
<input type="text" name="field1" size="2"> 時間
<input type="text" name="field2" size="2"> 分
<input type="text" name="field3" size="2"> 秒
</form>

</body>
</html>

解説

<head></head> 内にスクリプトを記述しておき、フォームのテキストフィールド内に経過時間を表示します。

ページを表示したときに自動的に計測を開始するので、bodyタグに onLoad="disp()" を指定しています。

青い文字の部分は、必要に応じて書き換えてください。