Compte à rebours javascript ne marche pas

chuckichucki -
xamurai Messages postés 223 Date d'inscription Statut Membre Dernière intervention - 16 janv. 2011 à 16:58

Bonjour,

Je voudrais afficher 2 comptes à rebours en javascript sur ma page.

Voici le code source tel qu'il apparait, mais cela ne marche pas. Le compte à rebours n'apparait pas. Savez vous pourquoi ?

<span id="rebours0"></span>
<span id="rebours1"></span>

 <script type="text/javascript">
function chrono(){


var secon0=46 ;//initialise les secondes
var minu0=54; //initialise les minutes
var heur0=13; //initialise les heures

if (secon0 != 0 || minu0 != 0 || heur0 != 0){// si on n'atteind pas 00:00:00
	secon0--;
	if (secon0<0){secon0=59;
	if (minu0 >0){ minu0--}else{minu0=59; heur0--;}
}
if (secon0 < 10 ){ secondes0 = '0'+secon0;}else {secondes0 = secon0;}
if (minu0 < 10 ) {minutes0 = '0'+minu0;}else {minutes0 = minu0;}
if (heur0 < 10 ) {heures0 = '0'+heur0;}else {heures0 = heur0;}

document.getElementById('rebours0').innerHTML = heures0+' heures '+minutes0+' minutes '+secondes0+' secondes ' ;

var secon1=46 ;//initialise les secondes
var minu1=54; //initialise les minutes
var heur1=13; //initialise les heures

if (secon1 != 0 || minu1 != 0 || heur1 != 0){// si on n'atteind pas 00:00:00
	secon1--;
	if (secon1<0){secon1=59;
	if (minu1 >0){ minu1--}else{minu1=59; heur1--;}
}
if (secon1 < 10 ){ secondes1 = '0'+secon1;}else {secondes1 = secon1;}
if (minu1 < 10 ) {minutes1 = '0'+minu1;}else {minutes1 = minu1;}
if (heur1 < 10 ) {heures1 = '0'+heur1;}else {heures1 = heur1;}

document.getElementById('rebours1').innerHTML = heures1+' heures '+minutes1+' minutes '+secondes1+' secondes ' ;

}
compte=setTimeout('chrono()',1000) //la fonction est relancée tous les secondes
chrono();
</script>

Merci

Afficher la suite

A voir également:

Compte à rebours javascript ne marche pas
Créer un compte google - Guide
Installer windows 10 sans compte microsoft - Guide
Créer un compte gmail - Guide
Comment savoir qui regarde mon compte facebook - Guide
Créer un compte instagram sur google - Guide

3 réponses

Réponse 1 / 3

xamurai Messages postés 223 Date d'inscription Statut Membre Dernière intervention 15

essaye ceci:
ta fonction reinitialise les variables à chaque appel.
en plus les conditions ne sont pas fermées convenablement:

var secon0=46 ;//initialise les secondes 
  var minu0=54; //initialise les minutes 
  var heur0=13; //initialise les heures 
  var secon1=46 ;//initialise les secondes 
  var minu1=54; //initialise les minutes 
  var heur1=13; //initialise les heures 
function chrono(){ 
   
  if (secon0 != 0 || minu0 != 0 || heur0 != 0){// si on n'atteind pas 00:00:00 
   secon0--; 
   if (secon0<0){secon0=59; 
    if (minu0 >0){ minu0--}else{minu0=59; heur0--;} 
    } 
    if (secon0 < 10 ){ secondes0 = '0'+secon0;}else {secondes0 = secon0;} 
    if (minu0 < 10 ) {minutes0 = '0'+minu0;}else {minutes0 = minu0;} 
    if (heur0 < 10 ) {heures0 = '0'+heur0;}else {heures0 = heur0;} 
    document.getElementById('rebours0').innerHTML = heures0+' heures '+minutes0+' minutes '+secondes0+' secondes ' ; 
    if (secon1 != 0 || minu1 != 0 || heur1 != 0){// si on n'atteind pas 00:00:00 
     secon1--; 
     if (secon1<0){secon1=59; 
     if (minu1 >0){ minu1--}else{minu1=59; heur1--;} 
    } 
    if (secon1 < 10 ){ secondes1 = '0'+secon1;}else {secondes1 = secon1;} 
    if (minu1 < 10 ) {minutes1 = '0'+minu1;}else {minutes1 = minu1;} 
    if (heur1 < 10 ) {heures1 = '0'+heur1;}else {heures1 = heur1;} 
    document.getElementById('rebours1').innerHTML = heures1+' heures '+minutes1+' minutes '+secondes1+' secondes ' ; 
   } 
setTimeout(chrono,1000) //la fonction est relancée tous les secondes 
   } 
 
} 

chrono();

chuckichucki

Cool merci xamurai ! Ton exemple marche

En fait je voudrais afficher 10 compte à rebours sur une page donc je fais des boucles php
Mais bizarrement ca buggue.

Pour trouver l'origine du bug j'ai repris ton code en essayant de mettre une 3eme entree. Voici le code ci-dessous

Désolé je suis vraiment nul en JavaScript et merci de ton aide.

<span id="rebours0"></span><span id="rebours1"></span><span id="rebours2"></span>

<script type="text/javascript">
var secon0=46 ;//initialise les secondes 
  var minu0=54; //initialise les minutes 
  var heur0=13; //initialise les heures 
  var secon1=46 ;//initialise les secondes 
  var minu1=54; //initialise les minutes 
  var heur1=13; //initialise les heures 
  var secon2=46 ;//initialise les secondes 
  var minu2=54; //initialise les minutes 
  var heur2=13; //initialise les heures 


function chrono(){ 
   
  if (secon0 != 0 || minu0 != 0 || heur0 != 0){// si on n'atteind pas 00:00:00 
	secon0--; 
   if (secon0<0){secon0=59; 
    if (minu0 >0){ minu0--}else{minu0=59; heur0--;} 
    } 
    if (secon0 < 10 ){ secondes0 = '0'+secon0;}else {secondes0 = secon0;} 
    if (minu0 < 10 ) {minutes0 = '0'+minu0;}else {minutes0 = minu0;} 
    if (heur0 < 10 ) {heures0 = '0'+heur0;}else {heures0 = heur0;} 
    document.getElementById('rebours0').innerHTML = heures0+' heures '+minutes0+' minutes '+secondes0+' secondes ' ; 
    if (secon1 != 0 || minu1 != 0 || heur1 != 0){// si on n'atteind pas 00:00:00 
     secon1--; 
     if (secon1<0){secon1=59; 
     if (minu1 >0){ minu1--}else{minu1=59; heur1--;} 
    } 
    if (secon1 < 10 ){ secondes1 = '0'+secon1;}else {secondes1 = secon1;} 
    if (minu1 < 10 ) {minutes1 = '0'+minu1;}else {minutes1 = minu1;} 
    if (heur1 < 10 ) {heures1 = '0'+heur1;}else {heures1 = heur1;} 
    document.getElementById('rebours1').innerHTML = heures1+' heures '+minutes1+' minutes '+secondes1+' secondes ' ; 


	 if (secon2 != 0 || minu2 != 0 || heur2 != 0){// si on n'atteind pas 00:00:00 
   secon2--; 
   if (secon2<0){secon2=59; 
    if (minu2 >0){ minu2--}else{minu2=59; heur2--;} 
    } 
    if (secon2 < 10 ){ secondes2 = '0'+secon2;}else {secondes2 = secon2;} 
    if (minu2 < 10 ) {minutes2 = '0'+minu2;}else {minutes2 = minu2;} 
    if (heur2 < 10 ) {heures2 = '0'+heur2;}else {heures2 = heur2;} 
    document.getElementById('rebours2').innerHTML = heures2+' heures '+minutes2+' minutes '+secondes2+' secondes ' ; 
	

   } 

setTimeout(chrono,1000) //la fonction est relancée tous les secondes 
   } 
  
 
} 


chrono();

xamurai Messages postés 223 Date d'inscription Statut Membre Dernière intervention 15

<html>  
  <head>  
  </head>  
  <body >      
    <span id="rebours0">
    </span>
    <br>
    <span id="rebours1">
    </span> 
    <br>
    <span id="rebours2">
    </span> 
    <br>
    <span id="rebours3">
    </span> 
    <br>
    <span id="rebours4">
    </span> 
    <br>
    <span id="rebours5">
    </span> 
    <br>
    <span id="rebours6">
    </span> 
    <br>
    <span id="rebours7">
    </span> 
    <br>
    <span id="rebours8">
    </span> 
    <br>
    <span id="rebours9">
    </span> 
<script type="text/javascript">

  //  heure * 3600  +  minutes * 60  +  secondes
  secondes0 = 13*3600 + 54*60 + 46;
  secondes1 = 13*3600 + 54*60 + 46;
  secondes2 = 13*3600 + 54*60 + 46;
  secondes3 = 13*3600 + 54*60 + 46;
  secondes4 = 13*3600 + 54*60 + 46;
  secondes5 = 13*3600 + 54*60 + 46;
  secondes6 = 13*3600 + 54*60 + 46;
  secondes7 = 13*3600 + 54*60 + 46;
  secondes8 = 13*3600 + 54*60 + 46;
  secondes9 = 13*3600 + 54*60 + 46;
  
function chrono(totalSecondes, tag){
 if(totalSecondes >0)
 {
  tag.innerHTML = (Math.floor(totalSecondes/3600))+' heures '+(Math.floor( (totalSecondes%3600)/60 ))+' minutes '+(totalSecondes%60)+' secondes ' ; 
    
  --totalSecondes;
  setTimeout(function(){chrono(totalSecondes, tag)},1000);
 }
} 

chrono(secondes0 , document.getElementById("rebours0")); 
chrono(secondes1 , document.getElementById("rebours1")); 
chrono(secondes0 , document.getElementById("rebours2")); 
chrono(secondes1 , document.getElementById("rebours3"));
chrono(secondes0 , document.getElementById("rebours4")); 
chrono(secondes1 , document.getElementById("rebours5"));
chrono(secondes0 , document.getElementById("rebours6")); 
chrono(secondes1 , document.getElementById("rebours7"));
chrono(secondes0 , document.getElementById("rebours8")); 
chrono(secondes1 , document.getElementById("rebours9"));
</script>  
  </body>
</html>

Réponse 2 / 3

xamurai Messages postés 223 Date d'inscription Statut Membre Dernière intervention 15

sauf que ce code est plus propre:


 var secon0=46 ;//initialise les secondes 
  var minu0=54; //initialise les minutes 
  var heur0=13; //initialise les heures 
  var secon1=46 ;//initialise les secondes 
  var minu1=54; //initialise les minutes 
  var heur1=13; //initialise les heures 
  
  secondes0 = heur0*3600 + minu0*60 + secon0;
  secondes1 = heur1*3600 + minu1*60 + secon1;
function chrono(totalSecondes, tag){
 if(totalSecondes >0)
 {
  tag.innerHTML = (Math.floor(totalSecondes/3600))+' heures '+(Math.floor( (totalSecondes%3600)/60 ))+' minutes '+(totalSecondes%60)+' secondes ' ; 
    
  --totalSecondes;
  setTimeout(function(){chrono(totalSecondes, tag)},1000);
 }
} 

chrono(secondes0 , document.getElementById("rebours0")); 
chrono(secondes1 , document.getElementById("rebours1"));

Réponse 3 / 3

chuckichucki

Ca marche nickel, merci infiniment de ton aide !

xamurai Messages postés 223 Date d'inscription Statut Membre Dernière intervention 15

de rien.

Votre réponse