IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

mon chronometre ne se duplique pas


Sujet :

JavaScript

  1. #1
    Débutant   Avatar de kaking
    Profil pro
    Inscrit en
    Mars 2008
    Messages
    753
    Détails du profil
    Informations personnelles :
    Âge : 35
    Localisation : France, Paris (Île de France)

    Informations forums :
    Inscription : Mars 2008
    Messages : 753
    Points : 262
    Points
    262
    Par défaut mon chronometre ne se duplique pas
    salut a tous ! 'oilou, ce coup ci, j'ai un probleme de chronometre :

    J'ai une page ou j'ai besoin d'afficher 3 compte a rebourds differents :

    j'ai donc fait ceci :

    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
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
     
    <SCRIPT language="Javascript">
    function IndiquerSecondes(sec)
    			{
    				secondes = sec;
    			}
    			function Chrono(i)
    			{
    				if (secondes > 0)
    				{
    					var minutes = Math.floor(secondes/60);
    					var heures = Math.floor(minutes/60);
    					secondes -= minutes * 60;
    					if (heures > 0)
    					{
    						minutes -= heures * 60;
    						if (minutes > 0)
    						{
    							text = "Il reste " + heures + ' h ' + minutes + ' min ' + secondes + ' sec';
    						}
    						else
    						{	
    							text = "Il reste " + heures + ' h ' + secondes + ' sec';
    						}
    						minutes = minutes + (heures * 60);
    						secondes = secondes + (minutes * 60) - 1;
     
    					}
    					else if (minutes > 0)
    					{
    						text = "Il reste " + minutes + ' min ' + secondes + ' sec';
    						secondes = secondes + (minutes * 60) - 1;
    					}
    					else
    					{
    						text = "Il reste " + secondes + ' sec';
    						secondes = secondes + (minutes * 60) - 1;
    					}
    				}
    				else
    				{
    					clearInterval(timer);
    					text = "Le temps est écoulé";
    				}
    				document.getElementById('chrono'+i).innerHTML = text;
    			}
    			function DemarrerChrono(i)
    			{
    				timer = setInterval('Chrono('+i+')', 1000);				
    			}
    </SCRIPT>
     
    <?php 
    $i=0;//a la fin, $i==2
    foreach($this->basicNiveauActuel as $exp){
    ?>
    L ARRIVEE EST PREVU POUR : <div id='chrono<?php echo $i;?>'></div>
    					<SCRIPT language="Javascript">IndiquerSecondes(<?php echo $exp['usc_date']-time();?>);DemarrerChrono(<?php echo $i;?>);</SCRIPT>
    <?php
    }

    mais mes trois divs chrono0, chrono1 et chrono2 affichent le meme decompte, qui est en plus 3 fois plus rapide ! on passe de 3 secondes en 3 secondes !

    comment faire siouplais pour dupliquer ce script ? actuellement, il ne marche que si je n'ai qu'un seul chrono a afficher !

    d'avance merci les gars !

  2. #2
    Inactif  

    Profil pro
    Inscrit en
    Mai 2010
    Messages
    345
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2010
    Messages : 345
    Points : 496
    Points
    496
    Par défaut
    Il vaut mieux passer par un objet que tu instancies, car là tu as des variables globales qui trainent et ce n'est pas bon.
    Ensuite dans ton code interne pour le calcul des heures/minutes/secondes, on peut le réduire à 4 lignes en utilisant Date() qui fera le calcul à ta place

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
     
    var d = new Date(0,0,0,0,0,_this.current),
                h=d.getHours(),
                m=d.getMinutes(),
                s=d.getSeconds();
                text = 'Il reste ' + (h>0 ? h + ' h ':'') + (m>0 ? m+' min ':' ') + (s>0 ?+s+' s ':' ');
    Pour finir il ne reste plus qu'à mettre ce code dans un objet et faire en sorte que cet objet soit paramétrable :

    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
    28
    29
    30
    31
    32
    33
    34
    35
     
    var chrono = function(start, callback) {
        var _this = this;
        this.start = start;
        this.current = start;
     
        var calc = function() {
            var text = '';
            if(_this.current>0) {
                var d = new Date(0,0,0,0,0,_this.current),
                h=d.getHours(),
                m=d.getMinutes(),
                s=d.getSeconds();
                text = 'Il reste ' + (h>0 ? h + ' h ':'') + (m>0 ? m+' min ':' ') + (s>0 ?+s+' s ':' ');
                _this.current--;
            } else {
                clearInterval(_this.timer);
                text = 'Le temps est écoulé';
            }
            if(typeof callback == 'string') {
                document.getElementById(callback).innerHTML = text;
            } else {
                callback(text);
            }
        }
     
        this.timer = setInterval(calc, 1000);
    };
     
    new chrono(4346, 'chrono1'); // va dans <div id="chrono1"></div>
    new chrono(6587, 'chrono2');
    new chrono(56, 'chrono3');
    new chrono(132, function(text) { //possibilité d'utiliser une fonction de calback pour faire le code que tu veux ensuite
          console.log(text);   
    });
    Exemple ici : http://jsfiddle.net/zFHzG/3/

  3. #3
    Débutant   Avatar de kaking
    Profil pro
    Inscrit en
    Mars 2008
    Messages
    753
    Détails du profil
    Informations personnelles :
    Âge : 35
    Localisation : France, Paris (Île de France)

    Informations forums :
    Inscription : Mars 2008
    Messages : 753
    Points : 262
    Points
    262
    Par défaut


    merci beaucoup, ca marche super !!!

    tres efficace !




    a bientot !
    -un developpeur tres reconnaissant

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Mon getline ne s'execute pas.
    Par mail1789 dans le forum C++
    Réponses: 7
    Dernier message: 21/08/2005, 19h42
  2. [XSL]Comment faire ceci ?? Mon for-each n'affiche pas tout !
    Par Devil666 dans le forum XSL/XSLT/XPATH
    Réponses: 4
    Dernier message: 27/07/2005, 15h04
  3. Mon dessin ne s'affiche pas au lancement...
    Par Deedier dans le forum MFC
    Réponses: 6
    Dernier message: 02/05/2005, 16h29
  4. [JApplet]mon applet ne s'affiche pas.
    Par yannick56 dans le forum Applets
    Réponses: 6
    Dernier message: 27/05/2004, 17h05
  5. Mon script cron n'est pas pris en compte
    Par tomnie dans le forum Linux
    Réponses: 11
    Dernier message: 31/03/2004, 11h19

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo