Rediriger vers une page après un compte à rebours

Version imprimable

Bonjour à tous,

J'ai ce petit script dans e <head> qui me permet de réaliser un compte à rebours de 10 secondes puis de rediriger.

Code:

1
2
3
4
5
6
7
8
9
10
11
window.setTimeout("document.form.time.value='10'",1000) 
window.setTimeout("document.form.time.value='9'",2000) 
window.setTimeout("document.form.time.value='8'",3000) 
window.setTimeout("document.form.time.value='7'",4000) 
window.setTimeout("document.form.time.value='6'",5000) 
window.setTimeout("document.form.time.value='5'",6000) 
window.setTimeout("document.form.time.value='4'",7000) 
window.setTimeout("document.form.time.value='3'",8000) 
window.setTimeout("document.form.time.value='2'",9000) 
window.setTimeout("document.form.time.value='1'",10000) 
window.setTimeout("document.form.time.value='0';location=('http://www.XXX.fr/Templates/msolo5.php');",11000)

Cependant, je voudrais rediriger vers http://www.XXX.fr/Templates/msolo5.php?id_alea=='.$_GET['id_alea'] et là :aie:

WAW ! Si tu veux un compte à rebours de 30 secondes, tu écris 30 lignes de code ?

Déjà, l'attribut language n'existe plus. C'est :

Code:

<script type="text/javascript">

Ensuite, pourquoi pas un setInterval ?
Code:

1 2 3 4 5 6 7 8 9 var decompte = 30; var timer = setInterval(function( ){ decompte--; document.form.time.value = decompte; if (decompte === 0) { clearInterval(timer); location = "http://www.XXX.fr/Templates/msolo5.php"; } }, 1000);
Enfin, tu ne peux pas utiliser une variable PHP dans du code JavaScript.

Code:

http://www.XXX.fr/Templates/msolo5.php?id_alea=='.$_GET['id_alea']

Cela dit, JavaScript peut accéder aux variables GET grâce à location.search.
Pour le reste, je ne comprends pas ce que tu cherches à faire avec ce double égal (==).

06/06/2014, 07h43
HAbroc

Merci pour cette réponse précise.

Effectivement , le == est une erreur de copier-coller :mrgreen:

Je ne veux pas utiliser une variable php avec du javascript, je veux diriger vers une page php après le décompte .
Mais j'ai la variable $_GET['id_alea'] à transmettre.

Comment faire avec location.search ?
06/06/2014, 08h49
iakou

Bonjour.

Code:

document.location.href="http://www.et caetera...";

et si vous avez des paramètres à passer

Code:

document.location.href="http://www.et caetera......" + "?id_alea=" + parametre ;

Vous devrez bien entendu, 'construire' la variable parametre, mais cela je vous laisse faire.
Cdlt

PS : Watilin vous a fort justement suggéré, que votre comte à rebours n'était pas "top"...
06/06/2014, 10h23
Invité

Il y a aussi la possibilité d'utiliser la balise refresh

Code:

<meta http-equiv="Refresh" content="30; URL=http://www.XXX.fr/Templates/msolo5.php?...">
06/06/2014, 10h44
Bovino

Citation:

Envoyé par HAbroc

Comment faire avec location.search ?

Comme indiqué dans la :faq: par exemple...
:arrow: Comment récupérer les paramètres passés dans une URL ?
06/06/2014, 16h11
Watilin
Citation:

Envoyé par chanyslas

Il y a aussi la possibilité d'utiliser la balise refresh

Je réprouve l'usage des meta refresh, et je vais tenter d'expliquer pourquoi.

D'abord (argument d'autorité :mrgreen:), le W3C déconseille leur usage en expliquant qu'elles peuvent désorienter l'utilisateur.

Ensuite, depuis la publication de cette note du W3C (novembre 2000), les navigateurs sont devenus de plus en plus sensibles aux redirections automatiques et proposent divers mécanismes pour les contrôler et les empêcher. Par exemple sous Firefox, il y a l'option « Prévenir lorsque des sites web tentent de rediriger ou de recharger la page ». Si l'option est activée, lorsqu'un site tente une redirection, un bandeau apparaît en haut de la fenêtre et l'utilisateur peut choisir d'autoriser ou non la redirection. Par conséquent, développer un mécanisme de redirection en se basant sur cette technique n'est plus fiable à l'heure actuelle.

Les meta refresh sont indiquées dans le cas où le JavaScript n'est pas disponible/activé sur le logiciel client. Dans le cas présent, nous contrôlons un compte à rebours par JavaScript et redirigeons par JavaScript, c'est cohérent. La meta refresh ne peut pas contrôler le compte à rebours. Si la page mélange un décompte visuel contrôlé par JavaScript et une meta refresh, un utilisateur qui n'a pas JavaScript ne verra pas de décompte, ou verra un décompte qui ne diminue pas, et pensera qu'il n'y aura pas de redirection.

D'autre part, la meta refresh fonctionne comme location.replace : la page actuelle est supprimée de l'historique de session (les boutons « précédent » et « suivant »), encore une source de confusion pour l'utilisateur.

Il faut aussi se rappeler que la meta est une http-equiv, c'est-à-dire, comme son nom l'indique, un équivalent HTML à un entête HTTP. Si c'est possible, il vaut mieux configurer le serveur pour envoyer directement l'entête Refresh, ce qui a plusieurs avantages :
- c'est faisable sur tous types de fichiers, pas seulement HTML
- on peut ajouter d'autres entêtes pour ajouter de informations (par exemple un code 301 ou 302 pour indiquer que la redirection est permanente ou temporaire)
- Le serveur a la possibilité de n'envoyer que les entêtes, économisant ainsi du trafic réseau (alors que la meta se trouve dans le corps HTTP)
- etc.
Les redirections JavaScript ne sont pas supervisées par le navigateur (d'ailleurs je me demande pourquoi :weird:), donc il est plus cohérent de concevoir son site avec cette technique. Et s'il y a un réel besoin de cibler les clients sans JavaScript, on peut placer une meta refresh dans une balise <noscript>.
06/06/2014, 19h57
HAbroc

Citation:

Envoyé par iakou

Bonjour.

Code:

document.location.href="http://www.et caetera...";

et si vous avez des paramètres à passer

Code:

document.location.href="http://www.et caetera......" + "?id_alea=" + parametre ;

Vous devrez bien entendu, 'construire' la variable parametre, mais cela je vous laisse faire.
Cdlt

PS : Watilin vous a fort justement suggéré, que votre comte à rebours n'était pas "top"...

Je viens d'essayer, mais je ne parviens pas à passer la variable.

ça me donne : http://www.XXX.fr/Templates/msolo5.php?id_alea=$_GET['id_alea']

là où je souhaiterais avoir par exemple : http://www.XXX.fr/Templates/msolo5.php?id_alea=16 si $_GET['id_alea']=16
06/06/2014, 20h34
iakou

Bonsoir.
Oui nous avons bien vu que vous ne maitrisiez pas JS.
C'est une simple manipulation de la chaine "query-string" :

Code:

var chaine = window.location.search ;

Ensuite il faut faire un petit travail pour récupérer la valeur du paramètre id_alea : 3 ou 4 lignes de JS que vous aurez à coeur de découvrir...
Cdlt
06/06/2014, 23h12
HAbroc

Entendu. Merci à vous tous.

Il y a une possibilité pour empêcher la reprise du compteur en cas d'actualisation de la page ?

Peut-être avec onbeforeunload ?
Code:

1 2 3 4 5 6 7 <script language="JavaScript"> function confirmExit() { return "Êtes-vous sûr de vouloir quitter ?" ; } window.onbeforeunload = confirmExit; </script>
A tester... (cette méthode peut convenir en prévention des erreurs de manipulation ou confirmation de lien)

08/06/2014, 15h11
thelvin

Tu peux par exemple sauvegarder l'état actuel du décompte dans un cookie, et utiliser cet état, s'il existe, pour initaliser le décompte.

Mais s'il faut résister aussi à l'effacement de cookies, il va falloir nous en dire un peu plus sur ce que tu fais.
08/06/2014, 16h10
Watilin

Citation:

Envoyé par HAbroc

Il y a une possibilité pour empêcher la reprise du compteur en cas d'actualisation de la page ?

Tu veux dire, empêcher que le compteur remonte à 10 ? Oui c'est possible, il faut simplement utiliser un moyen de stockage d'information qui survive d'une page à l'autre (car quand j'actualise la page, du point de vue de JavaScript, ce n'est plus la même page). Tu peux utiliser un paramètre GET, un cookie comme le suggère Thelvin, ou encore le localStorage.
09/06/2014, 13h31
iakou

Huuumm... Cookie !...:P