Horloge temps réel [javascript]

Résolu
letsfire_89 Messages postés 237 Date d'inscription   Statut Membre Dernière intervention   -  
letsfire_89 Messages postés 237 Date d'inscription   Statut Membre Dernière intervention   -
Bonjour,

Je dois faire une horloge en javascript utilisant setInterval() et clearInterval().

Voici mon fichier js: 

function chronos(){
	
var horloge;
horloge = document.getElementById("horloge")
var now=new Date();
with(now){
		  j=getDate();
		  m=getMonth();
		  fy=getFullYear();
		  h=getHours();
	      mm=getMinutes();
		  s=getSeconds();
		  }

horloge.innerHTML += "<br/>"+j+"/"+m+"/"+fy+"<br/>"+h+"H"+mm+"m"+s;

                   }
clearInterval(temporisation);
temporisation=setInterval('chronos()',1000);


Au début sans le clearInterval(), l'heure s'affichait par dessus l'ancienne heure toutes les secondes.
Je ne sais pas où mettre clearInterval() pour que l'heure se rafraichisse toutes les secondes.

Pourriez-vous m'aider SVP?

Merci
Configuration: VISTA pro Thinkpad R60 4 Go de mémoire vive

1 réponse

  1.
    letsfire_89 Messages postés 237 Date d'inscription   Statut Membre Dernière intervention   261
     
    SOLUTION:

    page html: 

    <?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
    <head>
        <title>date et heure</title>  
        <link rel="stylesheet" media="screen" type="text/css" href="exY.css"/>
    </head>
    <body>
	
	    <script src="date.js" type="text/javascript"></script>
		<noscript>
			<p>
				 javascript non pris en charge
			</p>
		</noscript>
		
		
		<div id="affichage_date"></div>
		
        <p>
            <a href="http://validator.w3.org/check?uri=referer">
			    <img src="http://www.w3.org/Icons/valid-xhtml10"
                 alt="Valid XHTML 1.0 Strict" height="31" width="88"/>
	        </a>
	        <a href="http://jigsaw.w3.org/css-validator/check/referer">
                <img style="border:0;width:88px;height:31px"
                 src="http://jigsaw.w3.org/css-validator/images/vcss-blue"
                 alt="CSS Valide !"/>
            </a>
        </p>
    </body>
</html>


    fichier js: 

    // Initialise la fonction rafraichir qui a pour but de rafraichier la date toutes les secondes
function rafraichir()
{
// On initialise la variable text dans laquelle on affichera la date
var text = '';
 
// On initialise la fonction date qui nous servira a afficher les caractéristiques de la date (jour, mois, heure ...)
var date = new Date();
 
/* Fonction ' JOUR SEMAINE ' */
// Le jour de la semaine sera affiché de la façon : Lundi.
var jour_actuel = date.getDay();
var chaine_jour = Array('Dimanche', 'Lundi', 'Mardi', 'Mercredi', 'Jeudi', 'Vendredi',
 'Samedi');
  var jour_semaine = chaine_jour[jour_actuel];
 
/* Fonction ' JOUR ' */
// Le jour sera affiché de façon 20.
// Pour les jours de 1 a 9, on affichera donc un '0' devant.
if ( date.getDate() <= 9 )
 {
  var jour = '0'+date.getDate();
 }
else
 {
  var jour = date.getDate();
 }
 
/* Fonction ' MOIS ' */
var mois_actuel = date.getMonth();
var chaine_mois = Array('janvier', 'f&eacute;vrier', 'mars', 'avril', 'mai',
 'juin', 'juillet', 'ao&ucirc;t', 'septembre', 'octobre', 'novembre',
 'd&eacute;cembre');
  var mois = chaine_mois[mois_actuel];
 
 
/* Fonction ' HEURES ' */
if ( date.getHours() <= 9 )
 {
  var heure = '0'+date.getHours();
 }
else
 {
  var heure = date.getHours();
 }
 
/* Fonction ' MINUTES ' */
if ( date.getMinutes() <= 9 )
 {
  var minutes = '0'+date.getMinutes();
 }
else
 {
  var minutes = date.getMinutes();
 }
 
/* Fonction ' SECONDES ' */
if ( date.getSeconds() <= 9 )
 {
  var secondes = '0'+date.getSeconds();
 }
else
 {
  var secondes = date.getSeconds();
 }
 
// On prépare l'affichage de la date et de l'heure
text +=  jour_semaine+' '+jour+' '+mois+' '+date.getFullYear();
text += '<br />';
text +=  heure+':'+minutes+':'+secondes;
 
// On indique que cette date sera affichée dans une balise dont l'"id" est "affichage_date"
document.getElementById('affichage_date').innerHTML = text;
}
// On écrit la balise dons l'id est "affichage_date"
// On peut aussi choisir une autre balise HTML !
document.write('<span id="affichage_date"></span>');
 
// Enfin, on rafraichi la fonction "rafraichir" toutes les secondes.
setInterval('rafraichir()',1000);
 
/* -- -- -- FIN -- -- -- */
    0

Discussions similaires

java script error in the main process
ceciel2307 -
Thibaut -

3 réponses
Durée du sablier Snapchat
Snapeeejdvjz -
shashanouu -

7 réponses
Que signifie l'horloge dans les profils facebook
ChatNotable27 -
Jula-iris -

1 réponse