Timer multipli e Javascript

**macking** · 26-02-2013, 22:09

Buonasera ragazzi, ho realizzato la pagina web che vi posto in basso, che crea dei countdown con javascript a partire da una determinata data e ora. Il problema è che solo uno funzione in tempo reale, gli altri solo al caricamento della pagina. Vi posto il codice:

codice:

 
<html>
<head>
<title>CountDown</title>
<head>
<script type="text/javascript">

function Timer(){
this.countdown=function(fineanno, finemese, finegiorno, fineore, fineminuti, finesecondi, nomediv)
{
var_div=nomediv;
var_anno=fineanno;
var_mese=finemese;
var_giorno=finegiorno;
var_ore=fineore;
var_minuti=fineminuti;
var_secondi=finesecondi;
data_scandeza= new Date(var_anno,var_mese-1,var_giorno,var_ore,var_minuti,var_secondi);
data_oggi= new Date();
differenza=(data_scandeza-data_oggi);
giorni=parseInt(differenza/86400000);
differenza=differenza-(giorni*86400000);
ore=parseInt(differenza/3600000);
differenza=differenza-(ore*3600000);
minuti=parseInt(differenza/60000);
differenza=differenza-(minuti*60000);
secondi=parseInt(differenza/1000);
differenza=differenza-(secondi*1000);
if (giorni <= "0" && ore <= "0" && minuti <= "0" && secondi <= "0")
{
document.getElementById(nomediv).innerHTML="Tempo scaduto";
}
else
{
document.getElementById(nomediv).innerHTML=giorni +' giorni '+ore+' ore '+minuti+' min '+secondi+' sec';
setTimeout("t"+var_div+".countdown(var_anno, var_mese, var_giorno, var_ore, var_minuti, var_secondi, var_div)",1000);
}
}
}
</script>






</head>
<body>

<div id="div2"></div>
<script>
var tdiv2 = new Timer();
tdiv2.countdown("2013","04","26", "23","00","00","div2");

</script>

<div id="div3"></div>
<script>
var tdiv3 = new Timer();
tdiv3.countdown("2013","04","26", "23","00","00","div3");

</script>
</body>
</html>

Spero che qualcuno possa aiutarmi, vorrei che i timer funzionassero tutti in tempo reale :-) Grazie in anticipo

**carlomarx** · 27-02-2013, 14:10

Il problema è che usi variabili globali che quindi si sovrascrivono ogni volta. In ogni caso, se fossi in te, io imposterei tutto diversamente…:

codice:

<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>CountDown</title>
<script type="text/javascript">
function Timer (sId, nYear, nMonth, nDay, nHour, nMinute, nSeconds) {
	if (arguments.length < 2) { throw new TypeError("Timer - not enough arguments"); }
	var domNode = document.getElementById(sId);
	this.expires = (new Date(nYear, nMonth - 1, nDay, nHour, nMinute, nSeconds)).getTime() || 0x1f3fffffc18;
	this.id = sId;
	if (domNode) { this.owner = domNode; }
	Timer.instances.push(this);
}

Timer.refreshAll = function () {
	for (var nDelta, nDLeft, nHLeft, nMLeft, nSLeft, oThis, oDisplay, nInst = 0; nInst < Timer.instances.length; nInst++) {
		oThis = Timer.instances[nInst];
		if (!oThis) { continue; }
		if (oThis.hasOwnProperty("owner")) { oDisplay = oThis.owner }
		else if (oDisplay = document.getElementById(oThis.id)) { oThis.owner = oDisplay; }
		else { continue; }
		nDelta = oThis.expires - Date.now();
		// Casual expiration test
		// if (Math.floor(Math.random() * 8) === 0) { nDelta = 0; }
		if (nDelta <= 0) {
			Timer.instances[nInst] = null;
			oDisplay.innerHTML = "Tempo scaduto";
			continue;
		}
		nDLeft = Math.floor(nDelta / 864e5);
		nDelta -= (nDLeft * 864e5);
		nHLeft = Math.floor(nDelta / 36e5);
		nDelta -= (nHLeft * 36e5);
		nMLeft = Math.floor(nDelta / 6e4);
		nDelta -= (nMLeft * 6e4);
		nSLeft = Math.floor(nDelta / 1e3);
		nDelta -= (nSLeft * 1e3);
		oDisplay.innerHTML = nDLeft + " giorni, " + nHLeft + " ore, " + nMLeft + " minuti e " + nSLeft + " secondi";
	}
};

Timer.instances = [];

Timer.session = setInterval(Timer.refreshAll, 1000);

</script>
</head>

<body>
<div id="div2"></div>
<script>
	var tdiv2 = new Timer("div2", 2019, 02, 26, 21, 00, 31);
</script>
<div id="div3"></div>
<script>
	var tdiv3 = new Timer("div3", 2013, 04, 26, 23, 00, 00);
</script>
</body>

</html>

Discussione: Timer multipli e Javascript

Strumenti discussione

Ricerca discussione

Visualizza

Timer multipli e Javascript

Permessi di invio