在 HTML5 中顺序播放音频文件

Question

如何使用PHP顺序播放音频文件？

我有多个音频文件，我想顺序播放而不是同时播放。我正在使用类似于以下的代码：

<audio controls autoplay='true'>
  <source src="sample1.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>

<audio controls autoplay='true'>
  <source src="sample2.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>

我需要在 sample1 播放完毕后 5 秒播放 sample2。在这两种情况下都不应涉及用户交互。

更新

我认为这应该像使用连续函数调用一样简单，但这不起作用。我开始使用下面的示例代码来研究和使用 sleep() 函数：

print "<br>Line1";
sleep(10);
print "<br>Line2";

这只会将整个脚本延迟 10 秒并打印两条语句，而不是一个接一个地打印。音频文件也是如此，这也是我最终要解决的问题。

Answer 1

在尝试了几篇文章后，我发现这对我有用

    var audionameslist = `
        audiolib/1.mp3,
        audiolib/2.mp3,
        audiolib/3.mp3
    `;
    var audionamesarray = audionameslist.split(',');
    var audio = new Audio(audionamesarray[0]);
        
    audio.src=audionamesarray[0];
    audio.play();
       
    index=1;
    audio.onended = function() {
        if(index < audionamesarray.length){
            audio.src=audionamesarray[index];
            audio.play();
            index++;
        }
    };

Answer 2

这个问题之前已经回答过了。 您不需要任何 PHP，一切都在 HTML5 API 中。

玩家已结束事件

ended

。只需在结束后更改

src

属性即可。 然后该元素将加载“下一首歌曲”。

看这里

仅供参考：我刚刚复制了你的标题并在谷歌中搜索了它，瞧！我发现了这个问题...

Answer 3

只是我的愿景...

<script>
    /**
     * Play audios one by one
     */
    (function () {

        var itemList = document.getElementsByTagName('audio');

        var eventHandler = function (e) {
            if (itemList[this.nextToPlay])
                itemList[this.nextToPlay].play();
        };

        for (var i = 0; i < itemList.length; i++) {
            if (itemList[i + 1]) itemList[i].nextToPlay = i + 1;
            itemList[i].addEventListener('ended', eventHandler, false);
        }
    })();
</script>

Answer 4

您可以创建一个如下所示的小型 JS。只需将音频元素 ID 传递给该函数，它就会按顺序播放。谢谢你，祝一切顺利。

function playAll(audioidlist) {
    var audioarray = audioidlist.split(',');
    for (var i = 0; i < audioarray.length; i++) {
        var audio = document.getElementById(audioarray[i]);
        audio.play();
        while (!audio.ended) {
        }
    }
}