setInterval【インターバル 設定】・clearInterval【インターバル 解除】
setTimeout【タイムアウト 設定】・clearTimeout【タイムアウト 解除】

setInterval【インターバル 設定】・clearInterval【インターバル 解除】

メモ

  • ※インタフェース仕様と関数仕様に相違あり
  • setInterval【インターバル 設定】
    • 指定インターバル時間 (ミリ秒) 毎に繰り返しインターバル関数呼び出し
  • clearInterval【インターバル 解除】
    • setInterval【インターバル 設定】の解除
    • clearTimeout【タイムアウト 解除】でも解除可
  • 関連:

構文

long [window.]setInterval ( Function func [, long timeout = 0 [, ...arguments ]] );
long [window.]setInterval ( DOMString code [, long timeout = 0 [, ...arguments ]] );
void [window.]clearInterval ( long handle );

【インターバル関数】
void interval ( [...arguments ] )

  • func:インターバル関数
  • code:インターバル関数コード文字列
  • timeout:インターバル時間 (ミリ秒) (0:即時呼び出し)
  • arguments:インターバル関数 引数
  • handle:インターバル識別子

  • インターバル識別子 (setInterval)
  • なし (clearInterval)

<script>
var interval;  // インターバル識別子
var counter;

function startInterval() {
  document.getElementById("start1").disabled = true;
  document.getElementById("stop1").disabled = false;
  counter = 0;
  document.getElementById("count").value = counter;
  interval = setInterval(funcInterval, (5 * 1000), "P1", "P2", "P3");
}

function funcInterval(p1, p2, p3) {
  document.getElementById("count").value = ++counter;
  document.getElementById("param").value = "(" + p1 + ", " + p2 + ", " + p3 + ")";
}

function stopInterval() {
clearInterval(interval);
  document.getElementById("start1").disabled = false;
  document.getElementById("stop1").disabled = true;
  document.getElementById("param").value = "";
}
</script>

<button id="start1" type="button" onclick="startInterval();">5 秒毎にカウントアップ</button>
<button id="stop1" type="button" onclick="stopInterval();" disabled>解除</button>
<input id="count" readonly style="width:50px;">
<input id="param" readonly style="width:100px;">


setTimeout【タイムアウト 設定】・clearTimeout【タイムアウト 解除】

メモ

  • ※インタフェース仕様と関数仕様に相違あり
  • setTimeout【タイムアウト 設定】
    • 指定タイムアウト時間 (ミリ秒) 経過後に一度だけタイムアウト関数呼び出し
  • clearTimeout【タイムアウト 解除】
    • setTimeout【タイムアウト 設定】の解除
    • clearInterval【インターバル 解除】でも解除可
  • 関連:

構文

long [window.]setTimeout ( Function func [, long timeout = 0 [, ...arguments ]] );
long [window.]setTimeout ( DOMString code [, long timeout = 0 ] );
void [window.]clearTimeout ( long handle );

【タイムアウト関数】
void timeout ( [...arguments ] )

  • func:タイムアウト関数
  • code:タイムアウト関数コード文字列
  • timeout:タイムアウト時間 (ミリ秒) (0:即時呼び出し)
  • arguments:タイムアウト関数 引数
  • handle:タイムアウト識別子

  • タイムアウト識別子 (setTimeout)
  • なし (clearTimeout)

<script>
var timeout;  // タイムアウト識別子

function startTimeout() {
  document.getElementById("start2").disabled = true;
  document.getElementById("stop2").disabled = false;
  timeout = setTimeout(funcTimeout, (5 * 1000), "P1", "P2", "P3");
}

function funcTimeout(p1, p2, p3) {
  alert("タイムアウト (" + p1 + ", " + p2 + ", " + p3 + ")");
  document.getElementById("start2").disabled = false;
  document.getElementById("stop2").disabled = true;
}

function stopTimeout() {
clearTimeout(timeout);
  document.getElementById("start2").disabled = false;
  document.getElementById("stop2").disabled = true;
  alert("解除");
}
</script>

<button id="start2" type="button" onclick="startTimeout();">5 秒後にダイアログ表示</button>
<button id="stop2" type="button" onclick="stopTimeout();" disabled>解除</button>