Compte à rebours secondes ne se réinitialise pas

Résolu

nocram18 Messages postés 531 Statut Membre -
nocram18 Messages postés 531 Statut Membre - 19 juin 2017 à 19:19

Bonjour,

Après pas mal de recherche je viens vers vous.

J'ai un compte à rebours qui affiche les minutes et les secondes en décrémentant.

Mon soucis est que lorsque les secondes se finissent je n'arrive pas à les réinitialiser et recommencer ma fonction "secondes" avec une boucle.

Dans l'idée est lorsque le compteur des secondes arrivent à zéro il recommencer à partir de 59 secondes, et cela X fois.

Les minutes elles se décrémentent toutes seules sans soucis car le compteur n'a pas besoin de refaire une boucle pour recommencer.

Les commandes setInverval et setTimeOut avec toutes les options possibles ne fonctionnent pas forcément.

Ici je vous joint seulement le code pour les secondes ou j'ai le problème.

<div class="article0_2_2 floatdroi block1">
				
			<script type="text/javascript">
		
					var cpt = 5 ;
				var x ;
 
				function secondes()
				{
					if(cpt>=0)
					{
						if(cpt>1)
						{
							var sec = " secondes.";
						} else {
							var sec = " seconde.";
						}
						document.getElementById("chrono_secondes").innerHTML = "et " + cpt + sec ;
						cpt-- ;
						x = setTimeout("secondes()",1000) ;
					}
					else
					{
					clearTimeout(x) ;
					}
				}
			</script>
				<h2>
				<body onload="minutes(); secondes();">
				<div id="chrono_secondes"></div>
				</h2>
		
		</div>

P-S : Désolé mais je ne connais pas spécialement le JS, je bidouille.

En vous remerciant d'avance, bonne journée.
--
Au plaisir. Je me répéte mais :<<Google is your friend>>..... Moi sur google c'est << nalpha 54 >> ;-). précisez les questions nous ne sommes pas devin.
N'oubliez pas de mettre en résolu les sujets.

Afficher la suite

3 réponses

jordane45 Messages postés 30426 Date d'inscription Statut Modérateur Dernière intervention 4 830

Bonjour,

Ton code se résume par ces quelques lignes :

<div class="article0_2_2 floatdroi block1">
	<h2>
		<div id="chrono_secondes"></div>
	</h2>
		
</div>

<script type="text/javascript">

		
var cpt = 5 ;
var x ;

function secondes(){
 var sec =  cpt>1 ? " secondes." : " seconde.";
 document.getElementById("chrono_secondes").innerHTML = "et " + cpt + sec ;
 
 cpt = (cpt == 0) ? 60 : cpt;
 cpt--;
 x = setTimeout("secondes()",1000) ;
}

secondes();
</script>

NB: Si tu fais un crhono dans lequel tu veux gérer les minutes et les secondes.... il suffit d'une Seule fonction (travaillant en secondes et tu n'auras que des "divisions" à faire...


<div class="article0_2_2 floatdroi block1">
	<h2>
    <div id="chrono_minutes"></div>
		<div id="chrono_secondes"></div>
	</h2>
		
</div>

<script type="text/javascript">

		
var cpt = 70 ; // en secondes
var x ;

function chrono(){

 var min =  Math.floor(cpt/60);
 var sec =  cpt - min*60;
 var strMin =  min>1 ? " minutes." : " minute.";
 var strSec =  sec>1 ? " secondes." : " seconde.";
 
 document.getElementById("chrono_minutes").innerHTML = min + strMin;
 document.getElementById("chrono_secondes").innerHTML = "et " + sec + strSec ;

 cpt--;
 x = setTimeout("chrono()",1000) ;
}

chrono();
</script>

nocram18 Messages postés 531 Statut Membre 26
Salut jordane45,

Merci de ta réponse. Ton script fonctionne niquel, il est simple et efficace.

Voici le script avec l'ajout de phrase pour ceux qui ne trouverai pas :
```
<div class="article0_2_2 floatdroi block1">

<h2><div id="chrono_secondes"></div></h2>
<script type="text/javascript">

  
var cpt = 125 ; // en secondes
var x ;

function chrono(){

 var min =  Math.floor(cpt/60);
 var sec =  cpt - min*60;
 var strMin =  min>1 ? " minutes" : " minute";
 var strSec =  sec>1 ? " secondes." : " seconde.";
 
 document.getElementById("chrono_minutes").innerHTML = "La page se fermera dans " + min + strMin;
 document.getElementById("chrono_secondes").innerHTML = "et " + sec + strSec ;

 cpt--;
 x = setTimeout("chrono()",1000) ;
}

chrono();
</script>
  </div>
```
Je mets le sujet en résolu, pas facile le JS, je me suis quand même pas mal creusé les méninges dessus, mais c'est cool, même si à la fin on a le cerveau qui chauffe.

Merci à tous, bonne journée à la prochaine :D

Je mets un +1 merci :D

EDIT pour jordane45 : Tu as fais comment pour rajouter les chiffres à côtés des lignes, tu as choisis quels langages ?
0
1. jordane45 Messages postés 30426 Date d'inscription Statut Modérateur Dernière intervention 4 830 > nocram18 Messages postés 531 Statut Membre
  
  https://codes-sources.commentcamarche.net/faq/10686-le-nouveau-codes-sources-comment-ca-marche#balises-code
  
  0
nocram18 Messages postés 531 Statut Membre 26

Merci ;)
0

thehitappli Messages postés 6 Statut Membre 2

Bonjour,
Ton erreur vient du fait que quand les secondes arrivent en dessous de 0 et que

clearTimeout(x) ;

ne réinitialisent pas le comptes des secondes mais réinitialisent seulement le compte de la seconde actuelle.

Essaye ça :


<div class="article0_2_2 floatdroi block1">
				
			<script type="text/javascript">
		
					var cpt = 5 ;
				var x ;
 
				function secondes()
				{
					if(cpt>=0)
					{
						if(cpt>1)
						{
							var sec = " secondes.";
						} else {
							var sec = " seconde.";
						}
						document.getElementById("chrono_secondes").innerHTML = "et " + cpt + sec ;
						cpt-- ;
						x = setTimeout("secondes()",1000) ;
					}
					else
					{
					cpt = 59;
                                     document.getElementById("chrono_secondes").innerHTML = "et " + cpt + sec ;
						cpt-- ;
						x = setTimeout("secondes()",1000) ;
					}
				}
			</script>
				<h2>
				<body onload="minutes(); secondes();">
				<div id="chrono_secondes"></div>
				</h2>
		
		</div>

Oublie pas

document.getElementById("chrono_secondes").innerHTML = "et " + cpt + sec ;
						cpt-- ;
						x = setTimeout("secondes()",1000) ;

après

cpt = 59;

car sinon ton chrono ne va pas affiché la seconde 59.

nocram18 Messages postés 531 Statut Membre 26

Salut thehitappli,

Niquel ca fonctionne, j'ai juste un petit décalage entre les minutes et les secondes mais faut que je règle ça dans les millisecondes, je pense.

Il y a un ptit bug c'est lorsqu"il recommence à 59, il affiche "59 Undefined" au lieu de "59 secondes" mais rien de grave ^^. C'est pour infos.

Bon j'ai cherché pendant toute la journée et il fallait juste que je recopie une des éléments du dessus, je suis dégouté.
Merci à toi.

Si tu as une idée pour l'undefined dit moi.

Je mettrai en résolu dans la semaine si pas de réponse.

Bonne soirée à tout le monde.
0

thehitappli Messages postés 6 Statut Membre 2

Pour le undefined je crois qu'il faut que tu mettes

var sec = " secondes.";

après

cpt = 59;

Ça donnerait :

<div class="article0_2_2 floatdroi block1">
    
   <script type="text/javascript">
  
     var cpt = 5 ;
    var x ;
 
    function secondes()
    {
     if(cpt>=0)
     {
      if(cpt>1)
      {
       var sec = " secondes.";
      } else {
       var sec = " seconde.";
      }
      document.getElementById("chrono_secondes").innerHTML = "et " + cpt + sec ;
      cpt-- ;
      x = setTimeout("secondes()",1000) ;
     }
     else
     {
     cpt = 59;
                                        var sec = " secondes.";
                                     document.getElementById("chrono_secondes").innerHTML = "et " + cpt + sec ;
      cpt-- ;
      x = setTimeout("secondes()",1000) ;
     }
    }
   </script>
    <h2>
    <body onload="minutes(); secondes();">
    <div id="chrono_secondes"></div>
    </h2>
  
  </div>

Bonne soirée.

nocram18 Messages postés 531 Statut Membre 26

Merci à toi thehitappli

J'ai opté pour la solution de jordane45, plus simple pour moi que celle que j'avais commencée.

Bonne journée ++

Je mets un +1 merci :D
0

Compte à rebours secondes ne se réinitialise pas

3 réponses

Discussions similaires

Newsletters