ugrás a tartalomhoz

Egyszerű számláló két időpont közt

P-mac · 2011. Aug. 2. (K), 19.36
Sziasztok,

Két dátum közti eltelt időt szeretnék kiírni, de úgy, hogy az eltelt napokat is órában adja meg.

Eddig jutottam:

<script type="text/javascript">
  function recordTime()
  {
    var kezdesido = (new Date(Date.UTC(2011, 7, 20, 12, 0, 0, 0))).getTime();
    var ido = (new Date()).getTime();
    var vegeido= new Date(Date.UTC(2011, 8, 21, 24, 0, 0, 0)).getTime();
    var diftime = ido-kezdesido
    var eltelt = kezdesido+diftime

    var mMsec = eltelt %1000; eltelt /= 1000;
    var mSec = eltelt %60; eltelt /= 60;
    var mMin = eltelt %60; eltelt /= 60;
    var mHour = eltelt %24; eltelt /= 24;

    var record = Math.floor(mHour) + ":"
        record += Math.floor(mMin) + ":"
        record += Math.floor(mSec) + "."
        record += Math.floor(mMsec)

    document.getElementById('record').innerHTML = record;
    if (ido>=vegeido)
    {
        document.getElementById('win').innerHTML = "<a style='color:red; font-size:14px; font-weight:bold;'>Letelt a kiszabott idő!</a>";
    }
    setTimeout("recordTime()",1)
  }
</script>
A két időpont között pont 800 óra van, és szeretném ha kb most vmi ilyesmit jelenítene meg: 273:23:43.012 és folyamatosan nőne.
‹ setInterval lassú IE 7-ben 8-ban! AJAX + WP + JSON probléma ›
 ■
1

Példa, visszaszámlálással

Poetro · 2011. Aug. 2. (K), 22.08
Azt nem tudom, neked hogyan jött ki a 800 óra, mikor az csak 780. Lehet eltévesztetted a hónapot? Ugyanis JavaScript-ben a hónapok 0-tól indulnak.
Példa.
<!DOCTYPE html>
<html>
<head>
  <title>Page Title</title>
</head>
<body>
  <div id="win"></div>
  <div id="record"></div>
  <script type="text/javascript">
  var record = document.getElementById('record'),
      win = document.getElementById('win'),
      osztok = [60, 60, 1e3],
      length = osztok.length - 1,
      kezdesido = (new Date(Date.UTC(2011, 7, 20, 12, 0, 0, 0))).getTime(),
      vegeido= (new Date(Date.UTC(2011, 8, 21, 24, 0, 0, 0))).getTime(),
      diff = vegeido - kezdesido;

  (function recordTime() {
    var ido = (new Date).getTime(), // Aktuális idő.
        eltelt = diff - ido + startido, // Megnézzük mennyi idő van még hátra.
        komponensek = [], // Ide gyűjtjük a komponenseket.
        szamjegyek, // Számjegyek száma.
        ertek, // Az aktuális érték.
        i; // Ciklus változó

    // Fordított sorrendben osztunk (ezred, masodperc, perc).
    for (i = length; i >= 0; i -= 1) {
      ertek = '' + eltelt % osztok[i];
      // Normalizáljuk az értéket 2 illetve 3 számjegyűre.
      szamjegyek = i < length ? 2 : 3
      while (ertek.length < szamjegyek) {
        ertek = '0' + ertek;
      }

      if (i === length - 1) {
        // Ha az utolsó előtti elemnél járunk (másodpercek), ponttal kapcsoljuk
        komponensek[0] = ertek + '.' + komponensek[0];
      }
      else {
        // Hozzáadjuk a komponensekhez.
        komponensek.push(ertek);
      }
      // Frissítjük az eltelt időt.
      eltelt = Math.floor(eltelt / osztok[i]);
    }
    // Végül hozzáadjuk az órákat.
    komponensek.push(eltelt);

    // Fordított sorrendben összekapcsoljuk őket.
    record.innerHTML = komponensek.reverse().join(':');
    if (ido >= vegeido) {
      win.innerHTML = "<a style='color:red; font-size:14px; font-weight:bold;'>Letelt a kiszabott idő!</a>";
    }
    else {
      setTimeout(recordTime, 15);
    }
  })();
  </script>
</body>
</html>
2

ez még nem stimmel

P-mac · 2011. Aug. 3. (Sze), 20.45
Neem azért hittem, hogy 800 óra, mert az egyik oldalon ezt írták a két idő különbségére.

Viszont a kód amit írtál, visszafele számol, és minden egyes frissítéskor újraindul.. Mintha nem is játszana az egész során szerepet a jelenlegi idő.

A megoldásnak valami olyannak kéne lennie, hogy felfelé számol, 00:00:00.000-tól 780:00:00.000-ig.

szerk: Illetve most már nem nullától, hanem az eddig eltelt időtől számolna felfelé.
3

augusztus 20.

Poetro · 2011. Aug. 3. (Sze), 20.59
A kezdő dátum augusztus 20, szóval még sok nap van hátra addig, nemhogy a szeptemberi befejezésig, ezért csináltam így. De innen kiindulva már meg tudod csinálni.
4

hmm

P-mac · 2011. Aug. 4. (Cs), 18.31
Logikusan átgondolva a dátumok idejét kéne módosítanom, és talán az i ciklust..

Próbálkoztam sokféleképpen, de nem sikerült megoldani.
5

kezdesido, vegeido, eltelt

Poetro · 2011. Aug. 4. (Cs), 18.51
Csak ezt a három változót kell módosítanod. Semmi mást.
6

megoldottam teljesen másképp :)

P-mac · 2011. Aug. 4. (Cs), 19.48
újragondoltam az egészet és tök egyszerű volt:

<script type="text/javascript">
	function recordTime()
	{
		var kezdesido = (new Date(Date.UTC(2011, 6, 20, 12, 0, 0, 0))).getTime();
		var ido = (new Date()).getTime();
		var vegeido= new Date(Date.UTC(2011, 7, 22, 0, 0, 0, 0)).getTime();
		var fulltime = vegeido-kezdesido;
		var eltelt = ido-kezdesido;

		var mMsec = eltelt %1000; eltelt /= 1000;
		var mSec = eltelt %60; eltelt /= 60;
		var mMin = eltelt %60; eltelt /= 60;
		var mHour = eltelt %3600; eltelt /= 3600;
		
		var mMsec = Math.floor(mMsec)
		var mSec = Math.floor(mSec)
		var mMin = Math.floor(mMin)
		var mHour = Math.floor(mHour)
		
		
		if (mHour<10) mHour="0"+mHour
		if (mMin<10) mMin="0"+mMin
		if (mSec<10) mSec="0"+mSec
		if (mMsec<10) mMsec="00"+mMsec
		else if (mMsec<100) mMsec="0"+mMsec

		var record = mHour + ":"
			record += mMin + ":"
			record += mSec + "."
			record += mMsec

		document.getElementById('record').innerHTML = record;
		
		if(fulltime <= eltelt)
		{
			document.getElementById('win').innerHTML = "<a style='color:red; font-size:14px; font-weight:bold;'>A számláló a végére ért.</a>";
		}
		else
		{
			setTimeout("recordTime()",18)
		}
	}
</script>

<body onload="recordTime();"> 
<div id="win"></div> 
<div id="record"></div> 
</body>