Signaler

Compte à rebours secondes ne se réinitialise pas [Résolu]

Posez votre question nocram18 469Messages postés vendredi 26 avril 2013Date d'inscription 16 juillet 2017 Dernière intervention - Dernière réponse le 19 juin 2017 à 19:19 par nocram18
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.
Afficher la suite 
Utile
+1
plus moins
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>

Cette réponse vous a-t-elle aidé ?  
nocram18 469Messages postés vendredi 26 avril 2013Date d'inscription 16 juillet 2017 Dernière intervention - 19 juin 2017 à 18:44
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 ?
Répondre
jordane45 18038Messages postés mercredi 22 octobre 2003Date d'inscription ModérateurStatut 11 août 2017 Dernière intervention - 19 juin 2017 à 19:17
http://codes-sources.commentcamarche.net/faq/10686-le-nouveau-codes-sources-comment-ca-marche#balises-code
Répondre
nocram18 469Messages postés vendredi 26 avril 2013Date d'inscription 16 juillet 2017 Dernière intervention - 19 juin 2017 à 19:19
Merci ;)
Répondre
Donnez votre avis
Utile
+0
plus moins
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 469Messages postés vendredi 26 avril 2013Date d'inscription 16 juillet 2017 Dernière intervention - 18 juin 2017 à 20:51
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.
Répondre
Donnez votre avis
Utile
+0
plus moins
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 469Messages postés vendredi 26 avril 2013Date d'inscription 16 juillet 2017 Dernière intervention - 19 juin 2017 à 18:46
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
Répondre
Donnez votre avis

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes.

Le fait d'être membre vous permet d'avoir des options supplémentaires.

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !