window.setTimeout

  • リビジョンの URL スラッグ: DOM/window.setTimeout
  • リビジョンのタイトル: window.setTimeout
  • リビジョンの ID: 170361
  • 作成日:
  • 作成者: Ceth
  • 現行リビジョン いいえ
  • コメント /* 構文 */

このリビジョンの内容

{{ DomRef() }}

概要

指定された遅延の後に、コードの断片または関数を実行します。

構文

timeoutID = window.setTimeout(func, delay[, param1, param2, ...]);
timeoutID = window.setTimeout(code, delay);

ここで、

  • timeoutID は、window.clearTimeout で使うことのできるタイムアウトの ID です。
  • funcdelay ミリ秒後に実行したい関数です。
  • code は代わりの書式で、delay ミリ秒後に実行したいコードの文字列です。
  • delay はミリ秒(1/1000 秒)で、関数呼び出しはこれにより遅延します。

Internet Explorer では、最初の構文で関数に渡す追加のパラメータは動作しないことに注意してください。

互換性

JavaScript 1.0, Netscape 2.0 で導入。Function オブジェクトの参照渡しは JavaScript 1.2, Netscape 4.0 で導入されました。MSHTML DOM によるサポートはバージョン 5.0 以降です。

window.setTimeout('window.parent.generateOutput()', 1000);
function generateOutput(aConcise) {
  if(aConcise)
    parent.generateConciseOutput();
  else
    parent.generateOutput();
}
window.setTimeout(generateOutput, 1000, true);
<html>
<head>
<title>setTimeout example</title>

<script type="text/javascript">
function delayedAlert()
{
  timeoutID = window.setTimeout(slowAlert, 2000);
}

function slowAlert()
{
  alert("That was really slow!");
}

function clearAlert()
{
  window.clearTimeout(timeoutID);
}
</script>
</head>

<body>
<button onclick="delayedAlert();"
 >show an alert box after 2 seconds</button><br>
<button onclick="clearAlert();">Cancel</button>
</body>
</html>

clearTimeout() の例も参照してください。

注記

window.clearTimeout() を使ってタイムアウトをキャンセルすることが出来ます。

もし関数を繰返し(即ち、N ミリ秒ごとに) 呼びたいなら、window.setInterval() を使うことを考慮してください。

'this' 問題

setTimeout() によって実行されるコードは、setTimeout() が呼び出された関数とは別の実行コンテキスト内で実行されます。結果的に、呼び出された関数の this キーワードは window (または global) オブジェクトに設定され、setTimeout が呼び出された関数の this 値と同じにはなりません。この問題は JavaScript リファレンス でより詳細に説明されています。

仕様

{{ DOM0() }}

{{ languages( { "en": "en/DOM/window.setTimeout", "fr": "fr/DOM/window.setTimeout", "pl": "pl/DOM/window.setTimeout" } ) }}

このリビジョンのソースコード

<p>
{{ DomRef() }}
</p>
<h3 id=".E6.A6.82.E8.A6.81" name=".E6.A6.82.E8.A6.81"> 概要 </h3>
<p>指定された遅延の後に、コードの断片または関数を実行します。
</p>
<h3 id=".E6.A7.8B.E6.96.87" name=".E6.A7.8B.E6.96.87"> 構文 </h3>
<pre class="eval"><i>timeoutID</i> = window.setTimeout(<i>func</i>, <i>delay</i>[, <i>param1</i>, <i>param2</i>, ...]);
<i>timeoutID</i> = window.setTimeout(<i>code</i>, <i>delay</i>);
</pre>
<p>ここで、
</p>
<ul><li> <code>timeoutID</code> は、<a href="ja/DOM/window.clearTimeout">window.clearTimeout</a> で使うことのできるタイムアウトの ID です。
</li><li> <code>func</code> は <code>delay</code> ミリ秒後に実行したい<a href="ja/Core_JavaScript_1.5_Reference/Objects/Function">関数</a>です。
</li><li> <code>code</code> は代わりの書式で、<code>delay</code> ミリ秒後に実行したいコードの文字列です。
</li><li> <code>delay</code> はミリ秒(1/1000 秒)で、関数呼び出しはこれにより遅延します。
</li></ul>
<p>Internet Explorer では、最初の構文で関数に渡す追加のパラメータは動作しないことに注意してください。
</p>
<h3 id=".E4.BA.92.E6.8F.9B.E6.80.A7" name=".E4.BA.92.E6.8F.9B.E6.80.A7"> 互換性 </h3>
<p>JavaScript 1.0, Netscape 2.0 で導入。Function オブジェクトの参照渡しは JavaScript 1.2, Netscape 4.0 で導入されました。MSHTML DOM によるサポートはバージョン 5.0 以降です。
</p>
<h3 id=".E4.BE.8B" name=".E4.BE.8B"> 例 </h3>
<pre class="eval">window.setTimeout('window.parent.generateOutput()', 1000);
</pre>
<pre class="eval">function generateOutput(aConcise) {
  if(aConcise)
    parent.generateConciseOutput();
  else
    parent.generateOutput();
}
window.setTimeout(generateOutput, 1000, true);
</pre>
<pre>&lt;html&gt;
&lt;head&gt;
&lt;title&gt;setTimeout example&lt;/title&gt;

&lt;script type="text/javascript"&gt;
function delayedAlert()
{
  timeoutID = window.setTimeout(slowAlert, 2000);
}

function slowAlert()
{
  alert("That was really slow!");
}

function clearAlert()
{
  window.clearTimeout(timeoutID);
}
&lt;/script&gt;
&lt;/head&gt;

&lt;body&gt;
&lt;button onclick="delayedAlert();"
 &gt;show an alert box after 2 seconds&lt;/button&gt;&lt;br&gt;
&lt;button onclick="clearAlert();"&gt;Cancel&lt;/button&gt;
&lt;/body&gt;
&lt;/html&gt;
</pre>
<p><a href="ja/DOM/window.clearTimeout#Example">clearTimeout() の例</a>も参照してください。
</p>
<h3 id=".E6.B3.A8.E8.A8.98" name=".E6.B3.A8.E8.A8.98"> 注記 </h3>
<p><code><a href="ja/DOM/window.clearTimeout">window.clearTimeout()</a></code> を使ってタイムアウトをキャンセルすることが出来ます。
</p><p>もし関数を繰返し(即ち、N ミリ秒ごとに) 呼びたいなら、<code><a href="ja/DOM/window.setInterval">window.setInterval()</a></code> を使うことを考慮してください。
</p>
<h4 id=".27this.27_.E5.95.8F.E9.A1.8C" name=".27this.27_.E5.95.8F.E9.A1.8C"> 'this' 問題 </h4>
<p><code>setTimeout()</code> によって実行されるコードは、<code>setTimeout()</code> が呼び出された関数とは別の実行コンテキスト内で実行されます。結果的に、呼び出された関数の <code>this</code> キーワードは <code>window</code> (または <code>global</code>) オブジェクトに設定され、<code>setTimeout</code> が呼び出された関数の <code>this</code> 値と同じにはなりません。この問題は <a href="ja/Core_JavaScript_1.5_Reference/Operators/Special_Operators/this_Operator#Method_binding">JavaScript リファレンス</a> でより詳細に説明されています。
</p>
<h3 id=".E4.BB.95.E6.A7.98" name=".E4.BB.95.E6.A7.98"> 仕様 </h3>
<p>{{ DOM0() }}
</p>
<div class="noinclude">
</div>
{{ languages( { "en": "en/DOM/window.setTimeout", "fr": "fr/DOM/window.setTimeout", "pl": "pl/DOM/window.setTimeout" } ) }}
Revert to this revision