Problems with (multiple) jQuery countdowns

Question

I'm working on a countdown right now. The goal is to display multiple countdowns on a page. One countdown with an interval() is not a problem, but when it gets to two or more countdowns it will only display the last countdown.

Countdown structure:

Grab the unix timestamp from <div value"..."> <div>
Turn unix timestamp with jQuery to a nice countdown.
Display all countdowns on the page with .html() or .text()

Hope you can help me out.

http://jsfiddle.net/be89dwno/

You can't just put a value attribute on a <div> element like that... Use at least an hidden input no ? Or a data- attribute — Brewal
– Brewal, Commented Jan 23, 2015 at 14:24

pumpkinzzz · Accepted Answer · 2015-01-23 14:29:05Z

1

try changing:

$(".timestamp").text(function(k){
    return seconds[k];
});

with:

$(this).text(seconds[k]);

demo here

answered Jan 23, 2015 at 14:29

pumpkinzzz

2,9852 gold badges20 silver badges34 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

kocu · Accepted Answer · 2015-01-23 15:57:35Z

1

If you don't need to keep the original value you can also use something like this:

$(".timestamp").each(function() {
    var timestamp_value = $(this).attr("value");
    var new_value =  timestamp_value - 1;
    //change how you want your time look like below
    var new_value_text = new_value.toString();
    $(this).attr("value", new_value);
    $(this).html(new_value_text);
});

put it in a function and then use setInterval. Demo link below:

http://jsfiddle.net/x6htakaw/

answered Jan 23, 2015 at 15:57

kocu

92 bronze badges

Collectives™ on Stack Overflow

Problems with (multiple) jQuery countdowns

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related