HTML 自动播放歌曲和 StartAt

Question

我有这段代码，但我不知道如何让这首歌从 0:19 秒开始。你能帮帮我吗？

<div class="fin-subheading">
  &middot; ROLEPLAY &middot;
  <audio id='music' volume='0.5' autoplay controls>
    <source src="anonymous.mp3" type="audio/mpeg">
  </audio>
</div>

<script>
  var audio = document.getElementById("music");
  audio.volume = 0.3;
</script>

Answer 1

您可以使用 currentTime 属性

window.onload = function() {
    const audio = document.getElementById("music");
    audio.volume = 0.3;
    audio.currentTime = 19;
    audio.play();
}

Answer 2

您可以在 src 属性中指定播放范围。请参阅文档 here:

When specifying the URI of media for an or element, you can optionally include additional information to specify the portion of the media to play. To do this, append a hash mark ("#") followed by the media fragment description.

A time range is specified using the syntax:

#t=[starttime][,endtime]

所以代替：

<source src="anonymous.mp3" type="audio/mpeg">

简单地说：

<source src="anonymous.mp3#t=n,m" type="audio/mpeg">

其中 n 和 m 分别是开始时间和结束时间。

范围也可以是无界的。例如，您可以这样做：

<source src="anonymous.mp3#t=19" type="audio/mpeg">

从第19秒开始一直播放到最后；甚至这个：

<source src="anonymous.mp3#t=,19" type="audio/mpeg">

从头开始到 19 秒。

Answer 3

您需要使用 canplaythrough 事件并在该事件中 currentTime 然后在到达该时间时 play。

请确保您没有在 HTML 中的音频标签中 autoplay。

<audio id="audio2" 
       preload="auto" 
       src="http://upload.wikimedia.org/wikipedia/commons/a/a9/Tromboon-sample.ogg" >
    <p>Your browser does not support the audio element</p>
</audio>

<script>
    myAudio=document.getElementById('audio2');
    myAudio.addEventListener('canplaythrough', function() {
      this.currentTime = 19;
      this.play();
    });
</script>

HTML 自动播放歌曲和 StartAt

HTML Auto-Play a song and StartAt

html

html5-audio