setInterval, mais qu'une fois!

**daftman9** · 03/11/2016, 12h14

Bonjour à tous,

J'ai un soucis qui me prends la tête depuis 2 jours, j'ai essayé des tas de trucs sans grand succès alors je me tourne vers vous.

J'ai un script qui affiche une valeur et je souhaite que toutes les 3s il affiche un chiffre différent (c'est con, heinh, mais c'est pour l'exemple :p)

Alors le fait est que ça marche! Mais il n'y a qu'il n'y a qu'une seule update après ça s’arrête même si la valeur change et je comprends pas pourquoi!!!

Pourriez-vous m'aider à élucider ce mystère ... qui me tape sur les nerfs

Merci

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
 
<div class="clock" style="margin:2em;"></div>
 
 
 
		<script type="text/javascript">
			var clock;
 
			$(document).ready(function() {
 
				// Instantiate a counter
				clock = new FlipClock($('.clock'), <?php echo $nbre; ?>
, {
					clockFace: 'Counter',
					minimumDigits: 4
 
				});
 
 
setInterval(function() clock.setValue(<?php  echo $nbre = rand(22,200);?>);}, 3000);
 
 
 
 
 
			});
		</script>

**sekaijin** · 03/11/2016, 13h15

la valeur ne change jamais dans ton script
alors même si la fonction est appelé toute les 3s elle utilise toujours la même valeur.

La charte du forum demande de ne pas poster de code php mais e code présent dans le navigateur.
ce n'est pas pour embêter les développeurs c'est pour qu'ils comprennent bien que seul ce code présent dans le navigateur est exécuté par JS.

si tu fais "afficher la source dans ton navigateur tu va voir un code comme

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
  var clock;
  $(document).ready(function() {
    // Instantiate a counter
    clock = new FlipClock($('.clock'), 5, {
      clockFace: 'Counter',
      minimumDigits: 4
 
    });
    setInterval(function(){ clock.setValue(5);}, 3000);

donc toute les 3s tu remets la valeur de clock à 5;

Conseil N°1 ne jamais mélanger php html et js
Conseil N°2 faire une version sans php

en appliquant ces de précepte tu va faire quelque chose comme

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<html>
  <head>
  </head>
  <body>
    <div class="clock" style="margin:2em;"></div>
    <script type="text/javascript">
      var clock;
      var nombre= 5;
      $(document).ready(function() {
        // Instantiate a counter
        clock = new FlipClock($('.clock'), nombre, {
          clockFace: 'Counter',
          minimumDigits: 4
        });
      setInterval(function(){ clock.setValue(nombre);}, 3000);
    </script>

puis en ajoutant php

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<html>
  <head>
    <script type="text/javascript">
      var phpVars = {
        "nombre": 5
      }
    </script>
  </head>
  <body>
    <div class="clock" style="margin:2em;"></div>
    <script type="text/javascript">
      var clock;
      $(document).ready(function() {
        // Instantiate a counter
        clock = new FlipClock($('.clock'), phpVars.nombre, {
          clockFace: 'Counter',
          minimumDigits: 4
        });
      setInterval(function(){ clock.setValue(phpVars.nombre);}, 3000);
    </script>

en procédant ainsi de façon méthodique tu vois vite que ton code ne peut pas fonctionner. ce n'est pas un problème de codage c'est un problème de conception.
et l'écriture en js sans ph ne laisse aucun doute.

A+JYT

**daftman9** · 04/11/2016, 09h59

Salut JYT,

Premièrement merci pour cette réponse! Le fait est que, comme tu t'en es sans doute rendu compte, je suis loin d'être développeur, donc je prends les conseils!!!

Maintenant j'ai deux soucis c'est que je maîtrise mieux la manip de variable php et je comprends pas bien la logique JS ce qui explique mes mélanges et mes erreurs de conceptions!

Le truc c'est que j'arrive pas à actualiser ma variable!! Quand tu fais ça

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
<script type="text/javascript">
      var phpVars = {
        "nombre": 5
      }
</script>

ton nombre = 5 > ça marche!

Mais j'ai besoin de rafraichir et rapatrier un valeur x (toutes les x secondes) pour la passer et l'afficher ici

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

setInterval(function(){ clock.setValue(phpVars.nombre);}, 3000);

Et cette variable je ne peux la récupérer qu'en php et c'est la où j'ai du mal dans la logique du code... c'est que je voulais faire l'appel dans boucle setInterval() pour affranchir la valeur toute les 3s... alors que dans ta propal l'appel de la variable est dans le header donc pas actualisé

Suis-je clair?

Merci de ta patience

Daft

**ABCIWEB** · 04/11/2016, 16h20

Pour rafraichir des données php sans besoin de rafraichir la page on utilise généralement ajax. Mais ce n'est pas très recommandé pour des requêtes automatiques fréquentes car cela surcharge le serveur et limite les possibilités de montées en charge (en rapport direct avec la fréquence des requêtes). Donc ça peut suffire pour des petits besoins ou si la fréquence est de plusieurs secondes mais ce n'est pas optimisé. Pour des besoins avancés et faire du push côté serveur on utilise plutôt javascript côté serveur, il y a aussi php websocket mais c'est peu utilisé.

setInterval, mais qu'une fois!

JavaScript

Discussions similaires

Partager

Partager