Rediriger le site Web après un certain temps

135

Que dois-je faire pour avoir une fonction sur un site Web où il est dit que cela vous redirigera vers le site en 3 secondes environ?

html redirect codedude
la source
2
duplicata possible de Comment puis-je rediriger vers une page (accueil) via une autre page (page de réussite) où un message de réussite doit être affiché?
kennytm
Je suis juste curieux, pourquoi voudriez-vous faire ça? Chaque fois que j'ai visité une telle page, j'aurais préféré être dirigé en 0 seconde.
allesklar
@allesklar désolé pour la réponse tardive. Je suis en train de développer un site et je voulais voir s'il était plus facile de passer de l'éditeur de code au navigateur Web sans appuyer sur Actualiser à chaque fois.
codedude
Ce générateur de redirection JS vous aidera à créer facilement des extraits de redirection différés. Il a un support noscript et seo, plus un correctif IE 8 - et inférieur - pour passer le référent http!
Patartics Milán
1
@allesklar un exemple pour utiliser ceci. Si vous changez de domaine et que vous souhaitez que tout le monde soit redirigé vers le nouveau domaine au cours du premier mois (mais en leur faisant savoir que l'ancien domaine sera supprimé après environ un mois). Parce que même si vous envoyez et envoyez un e-mail, il y a toujours quelqu'un qui oublie et va à l'ancien domaine.
patricia

Réponses:

209 
<meta http-equiv="refresh" content="3;url=http://www.google.com/" />
Darin Dimitrov
la source
Ou simplement rediriger vers la racine si vous avez plusieurs sites utilisant <meta http-equiv = "refresh" content = "3; url = /" />
DJSampat
1
Le W3C recommande de ne pas utiliser cette balise: w3.org/TR/WCAG10-HTML-TECHS/#meta-element
huseyin39
69

Vous recherchez probablement le meta refreshtag :

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

Notez que l'utilisation de meta refreshest obsolète et désapprouvée ces jours-ci, mais parfois c'est la seule option viable (par exemple, si vous ne parvenez pas à générer des en-têtes de redirection HTTP côté serveur et / ou que vous devez prendre en charge des clients non JavaScript, etc. ).

LukeH
la source
52

Si vous voulez un meilleur contrôle, vous pouvez utiliser javascript plutôt que la balise meta. Cela vous permettrait d'avoir un visuel quelconque, par exemple un compte à rebours.

Voici une approche très basique utilisant 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>
Développer l'extrait

mbrevoort
la source
Ce serait la voie à suivre si vous souhaitez que le texte compte à rebours de manière dynamique jusqu'à 0 avant la redirection. Utilisez une minuterie d'une seconde, où la fonction de minuterie met à jour le texte HTML, puis lancez une nouvelle minuterie d'une seconde, jusqu'à ce que 3 secondes se soient écoulées, puis effectuez la redirection.
Remy Lebeau
19

Voici un exemple complet (mais simple) de redirection après X secondes, lors de la mise à jour d'un compteur div:

<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>
Développer l'extrait

Le contenu initial du counterdiv est le nombre de secondes à attendre.

noamtm
la source
Cela n'a pas fonctionné jusqu'à ce que je le remplace location.href="https://example.com";parwindow.location='https://example.com'
NateH06
1
Peut-être mieux utiliser window.location.replace("http://example.com");pour les raisons évoquées ici: stackoverflow.com/a/506004 Le changement apporterait cette réponse plus générale.
Psyché
10

Le moyen le plus simple consiste à utiliser une balise HTML META comme celle-ci:

<meta http-equiv="refresh" content="3;url=http://example.com/" />

Wikipédia

Ehsan
la source
4

Placez le code de redirection HTML suivant entre les balises et de votre code HTML.

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

Le code de redirection HTML ci-dessus redirigera instantanément vos visiteurs vers une autre page Web. Le contenu = "3; peut être remplacé par le nombre de secondes que vous souhaitez que le navigateur attende avant la redirection. 4, 5, 8, 10 ou 15 secondes, etc.

Muhammad Saqib
la source
1

Utilisez ce simple code javascript pour rediriger la page vers une autre page en utilisant un intervalle de temps spécifique ...

Veuillez ajouter ce code dans la page de votre site Web, que vous souhaitez rediriger:

<script type="text/javascript">
(function(){
   setTimeout(function(){
     window.location="http://brightwaay.com/";
   },3000); /* 1000 = 1 second*/
})();
</script>
Sunny SM
la source
<meta http-equiv="refresh" content="3;url=http://example.com/" />est une meilleure option car elle est plus simple et fonctionne sans prise en charge de JavaScript.
Edward
vous avez raison bro ... mais cela dépend de la situation ... parfois nous devons rediriger sur un événement spécifique car JS est la meilleure option.
Sunny SM
Je comprends ce que vous voulez dire, "Sunny SM". Bien que les balises meta devraient être utilisées presque toujours, il pourrait y avoir des scénarios spécifiques comme le vôtre où JavaScript serait la seule option.
Edward le