两个音频文件一个一个播放答案

【问题标题】：Two audio files play one by one两个音频文件一个一个播放
【发布时间】：2020-01-12 00:43:55
【问题描述】：

通过单击play 按钮，两个音频文件应该开始一个接一个地播放，但在我的情况下，它们同时开始播放。问题是如何让它们一个一个播放，audio_1然后audio_2？

   let audio1 = new Audio('audio_1.mp3');
   audio1.play();  

   let audio2 = new Audio('audio_2.mp3');
   audio2.play();

【问题讨论】：

只播放第一个文件onended的第二个文件？ w3schools.com/jsref/event_onended.asp
检查这个问题的答案，也许有帮助：stackoverflow.com/questions/30069988/…

标签： javascript audio

【解决方案1】：

你可以给它添加一个事件监听器：

let audio1 = new Audio('audio_1.mp3');
let audio2 = new Audio('audio_2.mp3');

audio1.addEventListener('ended' => audio2.play());

audio1.play();

【讨论】：

嗨@Valter，感谢您的回复，但它不起作用。
对@JohnPix 感到抱歉，只需将事件名称从“onended”改成“ended”就可以了。

【解决方案2】：

这是一个使用 javascript onended 的简单解决方案。

let button = document.querySelector('button');
let audio = new Audio('audio_1.mp3');

function playAudio(){
audio.play();
audio.onended = function() {
    audio.src='audio_2.mp3'
    audio.play();
};
}

button.addEventListener(
'click', 
playAudio
)

【讨论】：

【解决方案3】：

使用承诺。

function play(url) {
 return new Promise(function(resolve, reject) {   // return a promise
     var audio = new Audio();                     // create audio wo/ src
     audio.preload = "auto";                      // intend to play through
     audio.autoplay = true;                       // autoplay when loaded
     audio.onerror = reject;                      // on error, reject
     audio.onended = resolve;                     // when done, resolve

     audio.src = path + url + suffix; // just for example
 });
}

参考thisstackoverflow 答案每当您想等待某个操作并且想要在完成前一个操作时执行操作时，请使用promise

【讨论】：