Ask A Question

Notifications

You’re not receiving notifications from this thread.

How do I put a live time(seconds) counter on a page?

Arjun Rajkumar asked in Javascript
As in it should go 00:00 .. 00:05.. 00.49 ..15:55 to whatever. 
Wondering how to do this on the front-end.

Should I just use jquery? Or something else? 
Any suggestions?

Thanks

Arjun
Reply
Hi Arjun,

You could use normal JS with the setInterval method. Something like this: 

function timer(seconds){
    clearInterval(countdown);
    displayRemainingTime(seconds);
    const then = Date.now() + seconds * 1000;
    countdown = setInterval(() => {
        const secondsLeft = Math.round((then - Date.now()) / 1000);
        if(secondsLeft < 0) {
            clearInterval(countdown);
            return;
        }
        displayRemainingTime(secondsLeft);
    }, 1000)
}

function displayTimeLeft(){
 //update dom
}


I did something like this as part of a Javascript 30 course by Wes Bos. Recommend checking it out

William

Reply
Join the discussion
Create an account Log in

Want to stay up-to-date with Ruby on Rails?

Join 79,047+ developers who get early access to new tutorials, screencasts, articles, and more.

    We care about the protection of your data. Read our Privacy Policy.

    Screencast tutorials to help you learn Ruby on Rails, Javascript, Hotwire, Turbo, Stimulus.js, PostgreSQL, MySQL, Ubuntu, and more.

    © 2023 GoRails, LLC. All rights reserved.