аудио автоигра следующая песня, когда предыдущий закончен

Question

Я хочу создать звуковой фоновый плеер, где пользователь может только щелкнуть по изображению, чтобы воспроизвести или остановить воспроизведение. У меня возникли проблемы с созданием или переустановкой существующих кодов, чтобы создать для него список воспроизведения, который автоматически воспроизводит следующую песню, когда предыдущий закончен. Я хочу сделать это в vanilla js.
Вот то, что я до сих пор:
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

здесь трюк, чтобы вызвать следующую песню:

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

Как играть другую песню на одном аудио тэгом:

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

Теперь вот классный пример плейлиста в html5, вы можете загрузить каждую песню в то время, если какой-то клиент s (мобильный) не будет счастлив, когда вы потребляете трафика, в следующем примере загружаются все аудиофайлы в то же самое время, чтобы иметь плавный переход от песни к песне, загрузки песни:

//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; 

Подчеркивая ведьма песня играя, с немного Jquery, да, случай да я ленивая, ленивая:

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

Fiddle here

Примечание: Если звука не играет, вручную проверить, если аудио URL, доступны