onload / innerHTML

Version imprimable

onload / innerHTML

Bonjour,

Je ne trouve pas mon erreur sur un script sensé afficher la date et l'heure avec actualisation en temps réel.
Je me suis inspiré d'une FAQ de ce site ainsi que d'un billet de blog présentant un code similaire :

Fichier index.html :
Code:

1 2 3 4 5 6 7 8 9 10 <!DOCTYPE html> <html> <head> <title>Affichage heure temps réel</title> <script type="text/javascript" src="datetime.js"></script> </head> <body onLoad="DateTime('heure');"> <p id="heure">L heure doit s afficher ici</p> </body> </html>
fichier datetime.js :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 function DateTime(id) { var date = new Date(); var AAAA = date.getFullYear(); var MM = date.getMonth(); var JJ = date.getDate(); var jour = date.getDay(); var heure = date.getHours(); var min = date.getMinutes(); var sec = date.getSeconds(); if (heure < 10) { heure = "0" + heure; } if (min < 10) { min = "0" + min; } if (sec < 10) { sec = "0" + sec; } var tab_jours = new Array('Dim', 'Lun', 'Mar', 'Mer', 'Jeu', 'Ven', 'Sam'); var affichage = tab_jour[JJ]+'. '+JJ+' '+MM+' '+AAAA+' '+heure+':'+min+':'+sec; document.getElementById(id).innerHTML = affichage; setTimeout('datetime('+id+')',1000); }
Seul le texte "L'heure doit s'afficher ici" apparait...
Idem en passant par window.onload = ...

J'imagine que le problème doit être gros comme une maison, mais je ne vois pas (NB: javascript est bien activé et fonctionnel).

Merci d'avance pour l'aide apportée ;)

15/04/2013, 18h03
Lorenzo77

salut,

minuscule et majuscule ... regarde dans ta console tu verras les erreurs
15/04/2013, 18h04
Bovino
Une première piste :

Code:

function DateTime(id)

Code:

setTimeout('datetime('+id+')',1000);

JavaScript est sensible à la casse !

Mais sinon, il y a plus simple :aie:
Code:

1 2 3 4 function DateTime(){ document.getElementById('heure').innerHTML = new Date().toLocaleString(); setTimeout(DateTime, 1000); }

Merci pour vos réponses.
Chkreungneugneu de casse... :aie:

Mais malheureusement, il n'y avait pas que cela...
Merci aussi de m'avoir rappelé que j'avais une console d'erreur dans Firebug ! J'ai ainsi pu trouver les autres erreurs :ccool:

En revoyant le code, je me suis dit aussi que l'appel récursif dans la fonction DateTime() n'était peut-être pas le mieux, donc je l'appelle désormais avec un setInterval.

Voici le code final (ça intéressera peut-être certains qui tomberont là dessus) :

Fichier index.html :
Code:

1 2 3 4 5 6 7 8 9 10 <!DOCTYPE html> <html> <head> <title>Affichage heure temps réel</title> <script type="text/javascript" src="datetime.js"></script> </head> <body onLoad="DateTime('heure');"> <p id="heure">L heure doit s afficher ici</p> </body> </html>
Fichier datetime.js :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 function DateTime(id) { setInterval('Clock("'+id+'")',1000); } function Clock(id) { var date = new Date(); var AAAA = date.getFullYear(); var MM = date.getMonth() + 1; var JJ = date.getDate(); var jour = date.getDay(); var heure = date.getHours(); var min = date.getMinutes(); var sec = date.getSeconds(); if (heure < 10) { heure = "0" + heure; } if (min < 10) { min = "0" + min; } if (sec < 10) { sec = "0" + sec; } var tab_jours = new Array('Dim', 'Lun', 'Mar', 'Mer', 'Jeu', 'Ven', 'Sam'); var affichage = tab_jours[jour]+'. '+JJ+'-'+MM+'-'+AAAA+' '+heure+':'+min+':'+sec; document.getElementById(id).innerHTML = affichage; }