Question

我有一个10秒长的音频文件，我想在用户单击按钮时播放它。但是，当用户按住按钮时，我希望音频从5s到7.5s循环播放，onmouseup我需要音频从头到尾播放（10s）。无需任何外部库就可以做到吗？

Answer 1

因此，我创建了以下JS Fiddle，它在5-7.5 onmousedown上循环。它通过跟踪currentTime属性并检查播放器是否在界内，并在界外进行重置来工作。

<button onclick="playSound()">play</button>
<button onmousedown="fivetoseven()">play 5-7</button>
<button onclick="stopSound()">stop</button>
<audio controls id="mp3" preload="auto" src="https://upload.wikimedia.org/wikipedia/commons/4/40/Toreador_song_cleaned.ogg"></audio>


<script>
  var mp3 = document.getElementById('mp3');

  function playSound() {
    mp3.play();
  }

  function fivetoseven() {
    if (mp3.currentTime < 5.0 || mp3.currentTime > 7.5) {
      mp3.currentTime = 5;
    }
    setTimeout(fivetoseven, 500)
  }


  function stopSound() {
    mp3.pause();
  }

</script>

JavaScript中的音频循环

1 个答案: