HTML 5 Audio Tag Multiple Files

In javascript you can do it like this (this is just to get you started):

audio = new Audio("start url");

  audio.addEventListener('ended',function(){
        audio.src = "new url";
        audio.pause();
        audio.load();
        audio.play();
    });

if you want you can also use the same player(jquery):

var audio = $("#player");

Adding multiple sources to tag doesn't work this way. You can use it to providing the source in multiple formats.(some browsers don't support mp3 - i.e. Firefox doesn't support mp3 and you should provide ogg file)

Sample:

<audio>
   <source src="" id="oggSource" type="audio/ogg" />
   <source src="" id="mp3Source" type="audio/mpeg" />
   Your browser does not support the audio element.
</audio>

Your case is different. You are trying to make a playlist. You can make a playlist by yourself:

http://www.lastrose.com/html5-audio-video-playlist/

http://jonhall.info/how_to/create_a_playlist_for_html5_audio

OR simply use third party plugins like:

http://www.jplayer.org/latest/demo-02-jPlayerPlaylist/

Using jPlayer would solve the browser compatibility issue too. For instance if you just provide .mp3 format, it will switch to flash version when user is browsing with Firefox.

HTML 5 Audio Tag Multiple Files

Related

Recent Posts