Sto costruendo un lettore di playlist mp3 con HTML5 e jQuery. A questo giocatore c'è una barra orizzontale che cresce gradualmente in concomitanza con il presente buffer del file mp3.Perché audio.buffered.end (0) ottiene un messaggio di errore quando provo a ottenere il tempo di bufferizzazione
Ecco il mio codice completo: get buffered end
HTML5:
<audio id="music" controls>
<source src="https://archive.org/download/musicTestAudio27/Very%20nice%20%2827%29.mp3" type="audio/mpeg">
</audio>
<br/>
<div id="buffered"></div>
CSS:
#buffered{
border:solid #ccc 1px;
height:10px;
background:red;
display:block;
width:1%;
}
Javascript:
var track = document.getElementById("music");
setInterval(function(){
var w = 100*(track.buffered.end(0))/track.duration;
$('#buffered').css("width",w+"%");
}, 1000);
ma Fir efox darmi un messaggio di errore, ha detto:
IndexSizeError: Index or size is negative or greater than the allowed amount
var w = 100*(track.buffered.end(0))/track.duration;
e Google Chrome, ha detto:
Uncaught IndexSizeError: Failed to execute 'end' on 'TimeRanges': The index provided (0) is greater than or equal to the maximum bound (0).
Thanks a lot. questo è stato molto utile. Ho cercato per quattro giorni. ma ora funziona come un fascino^_^ Ho aggiunto questo: ** 'if (track.onprogress) { var w2 = 100 * (track.buffered.end (0))/track.duration; $ ('# buffered'). Css ("width", w2 + "%"); } '** – user3524045