Question

我在背景中有一段音频自动启动和循环。

即

<audio autoplay loop>
  <source src="bee_fly_by.mp3" type="audio/mpeg">
</audio>

有没有办法可以在再次播放之前设置延迟？所以我需要说循环之间有10秒的差距。

Answer 1

音频元素有ended个事件。但是当视频循环播放时，结束的事件将永远不会发生。

所以你也应该为视频循环编写代码，就像这样。

var audioControl = document.getElementById("myAudio");
audioControl.onended = function(){
    this.currentTime = 0;
  var delay = setTimeout(function(){
    audioControl.play();
    clearTimeout(delay);
  }, 5000);
}

工作小提琴：https://jsfiddle.net/5ggmdg7m/

Answer 2

这真的不是很难，你可以对此非常感兴趣，但是使用setTimeout的简单解决方案在这里应该非常简单。

假设jQuery在此页面上可用，下面的内容应该可以使用（如果页面上有多个音频剪辑ID，则使用您的音频剪辑ID进行修改）：

function wait() {
    console.log("audio clip ended, waiting 10 seconds to replay....");
    setTimeout(play, 10000);
}

function play() {
    $("audio")[0].play();
    $("audio").on("ended", wait);
}

$(document).ready(function() {
    play();
});

设置循环与音频标签之间的延迟

2 个答案: