Javascript 如何按顺序播放多个音频文件

Javascript 如何按顺序播放多个音频文件,javascript,html,html5-audio,Javascript,Html,Html5 Audio,我有几个长故事,其中的源音频是逐句音频文件。我想创建一个网页,在这里人们可以多次听某个故事的个别句子,或者从头到尾听整个故事 首先,我的网页有许多元素,每个元素都在一个中,并带有相应的文本。每个元素对应于故事的一个句子 我正要开始编写一个javascript对象,它将允许某种“全部播放”功能,你点击按钮,它将播放音频[0],完成后,播放音频[1],等等。它还将有一个“暂停”按钮,跟踪你的位置,这样,每个句子仍然可以播放或欣赏,因为它们都有一个音频元素。或者,可以使用顶部的“全部播放”按钮,将音频

我有几个长故事,其中的源音频是逐句音频文件。我想创建一个网页,在这里人们可以多次听某个故事的个别句子,或者从头到尾听整个故事

首先,我的网页有许多
元素,每个元素都在一个
中,并带有相应的文本。每个
元素对应于故事的一个句子

我正要开始编写一个javascript对象,它将允许某种“全部播放”功能,你点击按钮,它将播放音频[0],完成后,播放音频[1],等等。它还将有一个“暂停”按钮,跟踪你的位置,这样,每个句子仍然可以播放或欣赏,因为它们都有一个
音频元素。或者,可以使用顶部的“全部播放”按钮,将
音频
元素的顺序视为一个大元素

然后我开始问自己这里是否有更好/更容易/更规范的解决方案。我想做的一件事是将所有这些单独的音频文件合并成一个大的音频文件,并可能创建“chapter”(章节)元素。这样更好吗


每种方法的优缺点是什么?是否有一些现成的解决方案已经为我做了,但我根本没有找到?

我使用javascript解决这个问题,使用音频对象和设置间隔。下面是一个例子:

  var sndLetItSnow = new Audio("audio/letItSnow.m4a");
  var sndSanta = new Audio("audio/snow.m4a");

  var playlist = [sndLetItSnow, sndSanta];

  var current = null;
  var idx = 0;

  function playSound() {
      if (current === null || current.ended) {
          // go to next
          current = playlist[idx++];

          // check if is the last of playlist and return to first
          if (idx >= playlist.length)
              idx = 0;

           // return to begin
           current.currentTime=0;

           // play
           current.play();
      }

  }

  setInterval(playSound, 1000);
有关音频对象的更多文档,请访问此页面:


我希望这有帮助

您可以使用结束事件在前一个声音完成时播放下一个声音():


你的问题与此相似:相似,但不相同。这个问题询问是否可以使用javascript控制多个音频元素。我认为这显然是可能的,我看到了如何做到这一点(或多或少)。我的问题是这是否是个好主意。或者,也许更重要的是,这是否比把我的音频文件集中在一起并创建某种分裂系统更好。或者,是否有第三种解决方案我在这里遗漏了。
var sounds = new Array(new Audio("1.mp3"), new Audio("2.mp3"));
var i = -1;
playSnd();

function playSnd() {
    i++;
    if (i == sounds.length) return;
    sounds[i].addEventListener('ended', playSnd);
    sounds[i].play();
}