時計を表示する(1)

無料・有料 レンタルサーバー比較


ブラウザ
Internet Explorer Netscape Firefox Opera
参考
JavaScriptの基本

動く時計を表示するスクリプトです。(年月日と時間を表示するタイプ)

ローカル時
グリニッジ標準時
世界標準時

ソース

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

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

function disp(){

	var now = new Date();

	// (不要な行を削除する)
	var watch1 = now.toLocaleString(); // ローカル時
	var watch2 = now.toGMTString(); // グリニッジ標準時
	var watch3 = now.toUTCString(); // 世界標準時

	// テキストフィールドにデータを渡す処理(不要な行を削除する)
	document.form1.field1.value = watch1; // ローカル時
	document.form1.field2.value = watch2; // グリニッジ標準時
	document.form1.field3.value = watch3; // 世界標準時

	setTimeout("disp()", 1000);

}

// -->
</script>

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

<form action="#" name="form1">
<input type="text" name="field1" size="50"> ローカル時<br>
<input type="text" name="field2" size="50"> グリニッジ標準時<br>
<input type="text" name="field3" size="50"> 世界標準時
</form>

</body>
</html>

解説

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

上記例では、ローカル時の他にグリニッジ標準時と世界標準時を表示していますが、不要な場合はそれらの行を削除してください。

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

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

ボタンのクリックで時計を動かす場合は、bodyタグの onLoad="disp()" を削除して、フォームの部分を以下のサンプルのように指定します。


サンプル

<form action="#" name="form1">
<input type="text" name="field1" size="50">
<input type="button" value="動かす" onClick="disp()">
</form>


inserted by FC2 system