HTML5: come ottenere correnteTempo e durata del tag audio in millisecondi

Question

Sto utilizzando tag audio HTML5 per riprodurre file audio nel mio modello. Per qualche scopo ho bisogno di tracciare il tempo corrente e la durata che mostra fino a millisecondi. Ora sono in grado di ottenere i valori solo in secondi. C'è qualche metodo possibile? Qui di seguito è il mio codice:

HTML 
<audio controls id="track" src="<path-to-soundtrack>" 
    ontimeupdate="TrackAudio(this)"> 
<p>Your browser does not support the audio element</p> 
</audio> 


JAVASCRIPT 
function TrackAudio(element){ 
var curTime = Math.floor(element.currentTime); 
console.log(curTime) //Value in seconds. 
} 

Answer 1

È possibile utilizzare:

<audio id="track" controls> 
    <source src="your.mp3" type="audio/mpeg"> 
    <source src="your.ogg" type="audio/ogg"> 
</audio> 
<script type="text/javascript"> 
var audio = document.getElementById('track'); 
audio.addEventListener('timeupdate',function(){ 
    var currentTimeMs = audio.currentTime*1000; 
    console.log(currentTimeMs); 
},false); 
</script> 

Si può leggere qui per maggiori informazioni sulla precisione del timeupdate event. Dipende dall'implementazione del browser, quindi tieni presente che otterrai risultati diversi da un browser/dispositivo a un altro.

È necessario utilizzare il metodo addEventListener anziché la proprietà ontimeupdate: è più gestibile.

Anche se è necessaria la copertura del browser, è consigliabile utilizzare sia i file audio ogg che mp3 come fonti.