一定時間後にウェブサイトをリダイレクトする


135

3秒ほどでサイトにリダイレクトされると表示されているWebサイトで機能を使用するには、どうすればよいですか?



私は好奇心旺盛ですが、なぜそんなことをしたいのですか?私がそのようなページにアクセスするたびに、私はむしろ0秒で指示されていたでしょう。
allesklar 2010

@allesklar返信が遅くなってすみません。私はサイトの開発中で、毎回更新を行わずにコードエディターからWebブラウザーに簡単に切り替えることができるかどうかを確認したいと思っていました。
codedude

このJSリダイレクトジェネレーターは、遅延リダイレクトスニペットを簡単に作成するのに役立ちます。noscriptとseoのサポートに加えて、IE 8以下が修正され、httpリファラーを渡すように修正されています!
PatarticsMilán、2015

1
@allesklarこれを使用する1つの例。ドメインを変更し、最初の月に全員を新しいドメインにリダイレクトする場合(ただし、古いドメインは1か月後に削除されることを通知します)。なぜなら、送信して電子メールを送信したとしても、古いドメインを忘れて移動する誰かが常にいるからです。
パトリシア2016

回答:



69

あなたはおそらくmeta refreshタグを探しています:

<html>
    <head>
        <meta http-equiv="refresh" content="3;url=http://www.somewhere.com/" />
    </head>
    <body>
        <h1>Redirecting in 3 seconds...</h1>
    </body>
</html>

meta refresh最近ではの使用は推奨されておらず、眉をひそめていますが、サーバー側でHTTPリダイレクトヘッダーを生成できない場合や、JavaScript以外のクライアントをサポートする必要がある場合など、これが唯一の実行可能なオプションである場合があります。 )。


52

より詳細な制御が必要な場合は、メタタグを使用する代わりにJavaScriptを使用できます。これにより、カウントダウンなど、ある種のビジュアルを使用できます。

ここに使用する非常に基本的なアプローチです setTimeout()

<html>
    <body>
    <p>You will be redirected in 3 seconds</p>
    <script>
        var timer = setTimeout(function() {
            window.location='http://example.com'
        }, 3000);
    </script>
</body>
</html>


これは、リダイレクトの前にテキストを動的に0までカウントダウンする場合に使用する方法です。1秒タイマーを使用します。タイマー関数はHTMLテキストを更新し、3秒が経過するまで新しい1秒タイマーを開始してから、リダイレクトを行います。
Remy Lebeau

19

カウンタdivを更新しながら、X秒後にリダイレクトする完全な(まだ単純な)例を次に示します。

<html>
<body>
    <div id="counter">5</div>
    <script>
        setInterval(function() {
            var div = document.querySelector("#counter");
            var count = div.textContent * 1 - 1;
            div.textContent = count;
            if (count <= 0) {
                window.location.replace("https://example.com");
            }
        }, 1000);
    </script>
</body>
</html>

counterdiv の初期コンテンツは、待機する秒数です。


私が交換されるまで、これは動作しませんでしたlocation.href="https://example.com";window.location='https://example.com'
NateH06

1
window.location.replace("http://example.com");ここで説明する理由により、stackoverflow.com / a / 506004を使用する方が良い場合があります。この変更により、この回答の一般性が高まります。
プシュケ


4

HTMLコードのタグとタグの間に次のHTMLリダイレクトコードを配置します。

<meta HTTP-EQUIV="REFRESH" content="3; url=http://www.yourdomain.com/index.html">

上記のHTMLリダイレクトコードは、訪問者を即座に別のWebページにリダイレクトします。content = "3;は、リダイレクトの前にブラウザが待機する秒数に変更される場合があります。4、5、8、10、または15秒など。


1

この単純なJavaScriptコードを使用して、特定の時間間隔でページを別のページにリダイレクトします...

このコードを、リダイレクトしたいWebサイトのページに追加してください。

<script type="text/javascript">
(function(){
   setTimeout(function(){
     window.location="http://brightwaay.com/";
   },3000); /* 1000 = 1 second*/
})();
</script>

<meta http-equiv="refresh" content="3;url=http://example.com/" />よりシンプルでJavaScriptサポートなしで機能するため、より良いオプションです。
エドワード

あなたは正解です...しかし、状況によって異なります。そのJSのために特定のイベントにリダイレクトする必要がある場合があります。
Sunny SM

「Sunny SM」という意味です。メタタグはほとんど常に使用する必要がありますが、JavaScriptが唯一のオプションとなるような特定のシナリオが考えられます。
エドワード
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.