web-dev-qa-db-ja.com

X秒後にJavaScriptを実行する

<div>とJavaScriptを使用したインタースティシャルページを作成しています。本当にシンプルなスクリプトですが、すっきりしています。

すべてが機能していますが、数秒後(たとえば、10秒など)にdivを閉じたいと思います。ここに私がこれまで持っているもの:

  • 2つのdiv、1と2があります。
  • 次のようなdiv 1のCSS設定があります。 (div 1にはスプラッシュスクリーンのコンテンツがあります)
  • Div 2は、ページを覆い、div 1のみを表示するレイヤーです。

Divをロードするには、次のようなonload関数を使用します。

onload="document.getElementById('div1').style.display='block';document.getElementById('div2').style.display='block'"

Divを非表示にするには、次のようなonclick関数を使用します。

<a href = "javascript:void(0)" onclick = "document.getElementById('div1').style.display='none';document.getElementById('div2').style.display='none'"></a>

タイマーでonclick関数を実行するにはどうすればよいですか?また、JavaScriptである必要があります。

41
Paulo Capelo

setTimeout 関数を探していると思います。

コードを少し見やすくするには、<script>ブロックでonclickの別の関数を定義します。

function myClick() {
  setTimeout(
    function() {
      document.getElementById('div1').style.display='none';
      document.getElementById('div2').style.display='none';
    }, 5000);
}

次に、onclickから関数を呼び出します

onclick="myClick();"
76
Strelok

setTimeoutは、設定した時間に基づいてJavaScriptコードを実行するのに役立ちます。

構文

setTimeout(code, millisec, lang)

使用法、

setTimeout("function1()", 1000);

詳細については、「 http://www.w3schools.com/jsref/met_win_settimeout.asp 」を参照してください

onclick = "setTimeout(function() { document.getElementById('div1').style.display='none';document.getElementById('div2').style.display='none'}, 1000)"

1000を遅延するミリ秒数に変更します。

4
Dogbert