audio auto odtwarzanie następnej piosenki po zakończeniu poprzedniej wersji

Question

Chcę utworzyć odtwarzacz audio w tle, w którym użytkownik może tylko kliknąć obraz, aby odtworzyć lub zatrzymać odtwarzanie. Mam problemy z tworzeniem lub ponownym wprowadzaniem istniejących kodów, aby utworzyć dla nich listę odtwarzania, która automatycznie odtwarza następny utwór po zakończeniu poprzedniego. Chcę to zrobić w waniliowym js.
Oto co mam do tej pory:
https://jsfiddle.net/rockarou/ad8Lkkrj/

var imageTracker = 'playImage'; 

swapImage = function() { 
    var image = document.getElementById('swapImage'); 
    if (imageTracker == 'playImage') { 
    image.src = 'http://findicons.com/files/icons/129/soft_scraps/256/button_pause_01.png'; 
    imageTracker = 'stopImage'; 
    } else { 
    image.src = 'http://findicons.com/files/icons/129/soft_scraps/256/button_play_01.png'; 
    imageTracker = 'playImage'; 
    } 
}; 

var musicTracker = 'noMusic'; 

audioStatus = function() { 
    var music = document.getElementById('natureSounds'); 
    if (musicTracker == 'noMusic') { 
    music.play(); 
    musicTracker = 'playMusic'; 
    } else { 
    music.pause(); 
    musicTracker = 'noMusic'; 
    } 
}; 

Answer 1

tutaj jest trick aby wywołać następną piosenkę:

music.addEventListener('ended',function(){ 
     //play next song 
    }); 

Jak grać inny utwór na samym znacznikiem dźwięku:

music.pause(); 
music.src = "new url"; 
music.load(); 
music.play(); 

Oto świetny przykład listy odtwarzania w html5, możesz załadować każdą piosenkę w tym samym czasie, w przypadku niektórych klientów s (mobile) nie będzie zadowolony, kiedy konsumować ruch, w następnym przykładzie wszystkie audio są ładowane w tym samym czasie mieć płynne przejście od piosenki do piosenki, ładowania utwory:

//playing flag 
var musicTracker = 'noMusic'; 
//playlist audios 
var audios = []; 
$(".song").each(function(){ 
     var load = new Audio($(this).attr("url")); 
    load.load(); 
    load.addEventListener('ended',function(){ 
     forward(); 
    }); 
    audios.push(load); 
}); 
//active track 
var activeTrack = 0; 

Podświetlanie piosenka czarownica gra, z odrobiną jquery, tak, przypadku tak jestem leniwy, leniwe:

var showPlaying = function() 
{ 
    var src = audios[activeTrack].src; 
    $(".song").removeClass("playing"); 
    $("div[url='" + src + "']").addClass("playing"); 
}; 

Fiddle here

Uwaga: Jeśli nie jest odtwarzany dźwięk'S, ręcznie sprawdzić, czy URL dźwiękowe są dostępne