Question

有权访问有效的音频文件：

<audio src="https://upload.wikimedia.org/wikipedia/commons/9/9b/Zh-Tianjin.ogg"></audio>
<audio src="https://upload.wikimedia.org/wikipedia/commons/8/8a/Zh-Beijing.ogg"></audio>
<audio src="https://upload.wikimedia.org/wikipedia/commons/7/73/Zh-Shanghai.ogg"></audio>
<audio src="https://upload.wikimedia.org/wikipedia/commons/e/e2/Zh-Chengdu.ogg"></audio>

给出一个按钮：

<button id="play">Play me!</button>

鉴于我成功播放了一个音频

$('#play').on('click', function () {
    $("audio")[0].play();
});

如何连续播放这几个音频，一个接一个？ - 纯JS和JQuery，其他JS库可以接受。

我的出发点是 this fiddle with basic tools

修改：我之前尝试过很多方法但没有成功，只使用.duration，window.setTimeout(function(){do_that}, time_ms)，.delay()几种组合而没有成功。请参阅：http://jsfiddle.net/Ka2Nh/7/

Answer 1

您可以使用ended event并触发下一个

var active = false;

$("audio").on("ended", function(){ 
    var audio = $(this).next("audio");
    if (audio.length) {
        audio.get(0).play();   
    } else {
        active = false;   
    }
});

$('#play').on('click', function () {    
    if (!active) {
        $("audio")[0].play();
        active = true;
    }
});

JSFiddle：http://jsfiddle.net/yMAs6/1/

如何链接播放几个HTML5音频文件，如流畅的播放列表？

1 个答案: