タイマー

<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title>サンプル</title>
<script type="text/javascript">
<!--
function execute() {
	alert("こんにちは");
}
function exec_timeout() {
	setTimeout("execute();", 3000);
}
// -->
</script>
</head>
<body>
<form action="#">
<input type="button" value="押して" onclick="exec_timeout();">
</form>
</body>
</html>

指定時間後に一度だけ処理を実行するには、setTimeout(処理内容, 時間) とします。

時間には処理を実行するまでの秒数（ミリ秒）を記述してください。処理内容に直接スクリプトを記述する場合は処理内容をクォーテーションで括ります。関数を指定する場合は setTimeout("execute();", 3000); や setTimeout(execute, 3000); のようにします。

たとえば <body onload="setTimeout('window.close();', 5000);"> とすると、5秒後にウィンドウが閉じます。

この例では、関数 exec_timeout を呼び出すと setTimeout() によって3秒後に関数 execute の内容が実行されます。

タイマーを止めるには

<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title>サンプル</title>
<script type="text/javascript">
<!--
var stop1;
function selfExec() {
	window.status = new Date().getSeconds();
	stop1 = setTimeout("selfExec();", 1000);
}
function stop_timeout() {
	if (stop1) {
		clearTimeout(stop1);
	}
}
// -->
</script>
</head>
<body>
<form action="#">
<input type="button" value="押して" onclick="selfExec();">
<input type="button" value="止める" onclick="stop_timeout();">
</form>
</body>
</html>

clearTimeout() を使用して setTimeout() によって動いているスクリプトを止めることができます。変数を指定して、clearTimeout() の括弧内に入れておく必要があります。

この例では、「押して」を押すとステータスバーに時間（秒）が表示されます。これを setTimeout() によって自分自身の関数 selfExec を繰り返し実行していますが、「止める」を押すと clearTimeout() によって時間が止まります。

指定した間隔の処理を実行する

<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title>サンプル</title>
<script type="text/javascript">
<!--
var stop2 = setInterval("alert('5秒間隔で表示されます。');", 5000);
function stop_interval() {
	if (stop2) {
		clearInterval(stop2);
	}
}
// -->
</script>
</head>
<body>
<form action="#">
<input type="button" value="止める" onclick="stop_interval();">
</form>
</body>
</html>

setTimeout() は指定した時間後に一度だけ実行しますが、setInterval() は指定した間隔の処理を実行します。setInterval() の処理を止めるには clearInterval() を使用します。

この例では、「押して」を押すと「止める」を押すまで5秒間隔でアラート表示し続けます。