Beste PHP-ers,

Ik heb een vraag over jQuery. Ik heb een stukje code waarmee ik vanaf een zelf bepaald punt kan terugtellen, alleen gaat dat in seconden. Nu wil ik graag dat dat gebeurt in uren, minuten en seconden. Is dit makkelijk op te lossen met deze code, of moet ik dan iets heel anders zoeken?

Hier de code waar het om gaat:


$(window).load(function(){
	$(document).ready(function(){  
  $('tr[id]').each(function () {
     var $this = $(this);
     var count = parseInt($this.attr("id"));
     countdown = setInterval(function(){
         $('.remain', $this).html(count + " seconds remaining!");
         if (count-- == 0) {
           //do something
           clearInterval(countdown);
         }
     }, 1000);
  });  
});​
}); 


Bij voorbaat dank,

Richard Hansma
Niemand die me kan helpen toevallig?
Ik heb nog steeds geen oplossing kunnen vinden voor mijn probleem. Is er iemand die me kan helpen met een zetje in de goede richting hoe ik dit kan doen (met deze code)?
Als je het aantal seconden hebt kan je de rest toch uitrekenen?

uren = secondenTimer / 3600 (naar beneden afronden)
(dagen = uren / 24 (naar beneden afronden))
minuten = (secondenTimer - (uren * 3600)) / 60 (naar beneden afronden)
seconden = secondenTimer - (uren * 3600) - (minuten * 60)
Of onafhankelijk van vorige uitkomsten:

var days = Math.floor(count/(60*60*24));
var hours = Math.floor(count/(60*60))%24;
var mins = Math.floor(count/60)%60;
var secs = count%60;
Hartelijk bedankt voor het reageren.

$(window).load(function(){
$(document).ready(function() {
  $('tr[id]').each(function() {
     var $this = $(this);
     var count = parseInt($this.attr("id"));
	 var days = Math.floor(count/(60*60*24));
	 var hours = Math.floor(count/(60*60))%24;
	 var mins = Math.floor(count/60)%60;
	 var secs = count%60;
     countdown = setInterval(function() {
            $('.remain', $this).html(hours + ":" + mins + ":" + secs);
            if (count-- == 0) {
                //do something
                clearInterval(countdown);
            }
        }, 1000);
    });
});
});

Het staat nu zoals ik wil, alleen loopt de teller niet. Als ik
if (count-- == 0) {
verander in
if (secs-- == 0) {
gebeurd dat wel, alleen krijg je dan min getallen... Wat kan ik hier aan doen?
Je conversie van countdown naar hh:mm:ss moet elke seconde gebeuren, dus elke interval. Met andere woorden moet je code binnen de interval uitgevoerd worden.
Eh, als ik `secs` doe i.p.v `count` werkt het wel, totdat de seconde op 0 komt, Dan gaat hij verder met min getallen. Ik snap niet precies wat je bedoelt met `binnen de interval`?
countdown = setInterval(function() {
            $('.remain', $this).html(hours + ":" + mins + ":" + secs);
            if (count-- == 0) {
                //do something
                clearInterval(countdown);
            }
        }

Zoals ik het begrijp, staat dit allemaal in de interval, aangezien je hem `set` en daarna `clear` je hem. Ik ben geen kei in JS, maar dat is wel te zien.

$(document).ready(function() {
  $('tr[id]').each(function() {
     countdown = setInterval(function() {
	// de berekening dus binnen de setInterval functie
	var $this = $(this);
     	var count = parseInt($this.attr("id"));
     	var days = Math.floor(count/(60*60*24));
     	var hours = Math.floor(count/(60*60))%24;
     	var mins = Math.floor(count/60)%60;
     	var secs = count%60;
            $('.remain', $this).html(hours + ":" + mins + ":" + secs);
            if (count-- == 0) {
                //do something
                clearInterval(countdown);
            }
        }, 1000);
    });
});


[size=xsmall]Toevoeging op 25/11/2012 16:06:59:[/size]

Je gebruikt trouwens óf $(document).ready() óf $(window).load()

De eerste gebruik je als je iets wilt doen als de volledige DOM geladen is, de tweede als je wilt dat naast de DOM ook alle overige content (zoals bijvoorbeeld plaatjes) geladen zijn voordat je iets uitvoert.
@Frits jouw code werkt niet bij mij. Ik krijg dan helemaal geen countdown te zien.


Maar het is me gelukt. Dit is de uiteindelijke code geworden:

$(window).load(function(){
$('tr[id]').each(function() {
	var $this = $(this);
	var count = parseInt($this.attr("id"));
	countdown = setInterval(function() {
	var days = Math.floor(count/(60*60*24));
	var hours = Math.floor(count/(60*60))%24;
	var mins = Math.floor(count/60)%60;
	var secs = count%60;
		 $('.remain', $this).html(hours + ":" + mins + ":" + secs);
            if (count-- == 0) {
                //do something
                clearInterval(countdown);
            }
        }, 1000);
    });
});


Iedereen heel erg bedankt voor de moeite.
Mensen vergeet niet dat JS standaard ook een Date Object heeft, wat datum of tijd makkelijk kan uitrekenen en weergeven in tekst.

Reageren