CODEWITHSUNDEEP
javascriptjqueryhtml
James Juanjie
James Juanjie

Reputation: 219

Get audio timeupdate in 00:00 format?

I'm using html5 audio tag in my project. everything works fine.

I need to use the timeupdate and get the value of the minutes that has passed in this format: 00:00

Currently I can only get that value as 0:00 with my code:

This is my code:

$(audio).bind('timeupdate', function(){
    var percent = audio.currentTime/ audio.duration * 100;

    /////Passed time////
    var mins = Math.floor(audio.currentTime / 60);
    var secs = Math.floor(audio.currentTime % 60);
    if (secs < 10) {
        secs = '0' + String(secs);
    }

    $('.Audio_passedTime').text(mins + ':' + secs);
});

And a working fiddle: http://jsfiddle.net/8cpwv2mf/

Could someone please advice on this issue?

Thanks in advance.

Upvotes: 1

Views: 378

Answers (2)

user2314737
user2314737

Reputation: 29397

You can define a function that pads numbers with 0's (like this)

function zpad(n) {
  return ("0" + n).slice(-2);
}

and then use it to format both minutes and seconds

$('.Audio_passedTime').text(zpad(mins) + ':' + zpad(secs));

Upvotes: 1

Teun van der Wijst
Teun van der Wijst

Reputation: 1029

You could use the same structure you used for the mins, like so:

$(audio).bind('timeupdate', function() {
    var percent = audio.currentTime/ audio.duration * 100;

 /////Passed time////
    var mins = Math.floor(audio.currentTime / 60);
    if (mins < 10) {
      mins = '0' + String(mins);
    }
    var secs = Math.floor(audio.currentTime % 60);
    if (secs < 10) {
      secs = '0' + String(secs);
    }

$('.Audio_passedTime').text(mins + ':' + secs);

Upvotes: 1

Related Questions