2014-04-13 27 views
8

Şablonumda ses dosyalarını çalmak için HTML5 ses etiketi kullanıyorum. Bir amaç için, currentTime'ı ve milisaniye kadar olan süreyi izlemem gerekiyor. Şimdi değerleri sadece saniyeler içinde alabiliyorum. Herhangi bir olası yöntem var mı?HTML5: CurrentTime ve ses etiketi süresini milisaniye olarak nasıl alabilirim

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. 
} 
+0

Neden burada Math.floor' kullandığınızı bilmiyorum. 'Math.floor' olmadan, 'element.currentTime' _should_ değeri, tarayıcının karşılayabileceği kadar hassastır. Bu nedenle, element.currentTime * 1000', size geçerli süreyi milisaniye cinsinden vermelidir. Bir şeyi yanlış anladım mı? –

+0

@musically_ut: Evet, bu daha yararlı olabilir. Milisaniye kadar zaman değerini göstermek için hassas değerleri kullanmak mümkündür. Çok teşekkürler. –

cevap

8

kullanabilirsiniz: Sen timeupdate event hassasiyeti hakkında daha fazla bilgi için buraya okuyabilir

<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> 

Aşağıda benim kodudur. Tarayıcı uygulamasına bağlı olduğundan, bir tarayıcıdan/cihazdan diğerine farklı sonuçlar alacağınızı unutmayın.

Ontimeupdate özelliğinden ziyade addEventListener yöntemini kullanmalısınız - daha fazla bakım yapılabilir.

Ayrıca, tarayıcı kapsamına ihtiyacınız varsa, hem ogg hem de mp3 ses dosyalarını kaynak olarak kullanmak iyidir.

+1

Bu cevap, dosyanın toplam süresini nasıl aldığınızı açıklamıyor. –