11548 sujets

JavaScript, DOM et API Web HTML5

[AJAX] Afficher une variable qui s'incrémente (Résolu)

Bonjour,

Quand quelqu'un poste un message sur mon site, la page indique qu'il a été posté il y a temps de secondes grâce à une différence de timestamp :

<?php $timediff = time() - $timestamp_message;

echo "Il y a ". $timediff."secondes";


J'aimerais savoir comment faire avec ajax pour que toutes les 30 secondes, $timediff soit actualisé sans charger la page.

PS : J'ai une piste avec le script JS suivant mais il ne fonctionne pas, il manque certainement du AJAX :

<div>Il y a <span id="timer1"><? echo $timediff ?></span> secondes</div>
<script>
var spanToUpdate = 'timer1';
document.onload = function() {
    setInterval( function() {
        var elmt = document.getElementById(spanToUpdate);
        var t = elmt.innerHtml.toInt() + 1;
        elmt.innerHtml = t.toString();
    } , 1000 );
};
</script>

Modifié par Tchernobyl (05 Aug 2011 - 00:18)
Salut,

C'est window.onload et non document.onload. Sinon, nul besoin d'AJAX.

<?php
$timediff=time()-$timestamp_message;
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr" dir="ltr">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title>Essai</title>
	<script type="text/javascript">//<![CDATA[
		var
			spanElt,spanId='timer1',spanVal=<? echo $timediff ?>;

		window.onload=function(){
			spanElt=document.getElementById(spanId);
			setInterval(
				function(){
					spanElt.innerHTML=spanVal++;
				},
				1000
			);
		}
		//]]>
	</script>

</head>
<body>
	<div>Il y a <span id="timer1"><? echo $timediff ?></span> secondes</div>
</body>
</html>
Sujet clos
Aller à