Я обнаружил много вопросов, похожих на мой, но результаты которых неэффективны.
Я пытаюсь отобразить текущее время звука как часы: минуты: секунды (00:00:00), а не только в «секундах» или «минутах и секундах». Текущий код - это то, что у меня есть ...
<audio id="audio" ontimeupdate="document.getElementById('tracktime').innerHTML = '0' + Math.floor(this.currentTime) + ' / ' + Math.floor(this.duration); " src="music.mp3"></audio>
Это отображает секунды как 0/0 внутри следующих ...
<span id="tracktime">0 / 0</span>
Я искал часы, и все решения, которые я нашел, просто ничего не делают.
Я даже нашел следующий код, чтобы помочь, но не знаю, как реализовать это в действии ontimeupdate в теге audio.
var minutes = '0' + Math.floor(currentTime / 60); var seconds = '0' + (currentTime - minutes * 60); var cur = minutes.substr(-2) + ':' + seconds.substr(-2);
Если возможно, я бы хотел, чтобы он отображался как два отдельных элемента. Вот так...
<div id="currentTime"></div>
<div id="duration"></div>
Спасибо!
Вот пример того, как вы можете это сделать
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>
Эта статья взята из Интернета, укажите источник при перепечатке.
Если есть какие-либо нарушения, пожалуйста, свяжитесь с[email protected] Удалить.
я говорю два предложения