<audio> currentTimeを正確な時刻に変換する

Question

私は自分のものとよく似た質問を多く発見しましたが、その結果は有効ではありません。

「秒」または「分と秒」ではなく、時間：分：秒（00:00:00）として表示するオーディオの現在時刻を取得しようとしています。現在のコードは、私は時間とソリューションIのすべてで検索しました...これは、次の内0/0として秒を表示...私が持っているもの

<span id="tracktime">0/0</span> 

<audio id="audio" ontimeupdate="document.getElementById('tracktime').innerHTML = '0' + Math.floor(this.currentTime) + '/' + Math.floor(this.duration); " src="music.mp3"></audio> 

です単に何もしていないことが判明しました。

私は次のコードを助けてくれましたが、これをオーディオタグの 'ontimeupdate'アクションに実装する方法がわかりません。

var minutes = '0' + Math.floor(currentTime/60); var seconds = '0' + (currentTime - minutes * 60); var cur = minutes.substr(-2) + ':' + seconds.substr(-2); 

可能であれば、私は2つの別個のアイテムとして表示したいと思います。ように...

<div id="currentTime"></div> 
<div id="duration"></div> 

ありがとう！ここで

Answer 1

はあなたが

window.addEventListener('load', function() { 
 
    var cur = document.querySelector('#cur'), 
 
     dur = document.querySelector('#dur') 
 
     vid = document.querySelector('#aud') 
 
}) 
 
    
 
aud.addEventListener('timeupdate', function(e) { 
 
    cur.textContent = "Current: " + sToTime(e.target.currentTime); 
 
    dur.textContent = "Duration: " + sToTime(e.target.duration); 
 
}) 
 

 
function sToTime(t) { 
 
    return padZero(parseInt((t/(60 * 60)) % 24)) + ":" + 
 
     padZero(parseInt((t/(60)) % 60)) + ":" + 
 
     padZero(parseInt((t) % 60)); 
 
} 
 
function padZero(v) { 
 
    return (v < 10) ? "0" + v : v; 
 
}

<audio id="aud" controls> 
 
    <source src="http://techslides.com/demos/samples/sample.mp3" type="audio/mpeg"> 
 
Your browser does not support the audio element. 
 
</audio> 
 

 
<p id="cur"></p> 
 
<p id="dur"></p>