HardCodeStuds HardCodeStuds - 3 months ago 23
Javascript Question

playlist with <audio> JavaScript

I'm creating a personal small Website and i want to play some songs on it. what i've tried to do is the following

<script type="text/javascript">

var i=1;
var nextSong= "";
var audioPlayer = document.getElementById('audio');
audioPlayer.onended = function(){
i++
nextSong = "Music/"+i+".mp3";
audioPlayer.src = nextSong;
audioPLayer.load();
audioPlayer.play();
if(i == 37) // this is the end of the songs.
{
i = 1;
}

}
</script>
<audio id="audio" src="Music/1.mp3"controls="controls" autoplay="autoplay" align=""> </audio>


however i can't get this to work , it just plays the first song and doesn't execute the JS i've tried alerting the state of i for example but it doesn't do anything.

Answer

Try this:

<script type="text/javascript">

var i=1;
var nextSong= "";
function setup() {
    document.getElementById('audio').addEventListener('ended', function(){
        i++;
        nextSong = "Music/"+i+".mp3";
        audioPlayer = document.getElementById('audio');
        audioPlayer.src = nextSong;
        audioPLayer.load();
        audioPlayer.play();
        if(i == 37) // this is the end of the songs.
        {
            i = 1;
        }
        }, false);
}
</script>
<body onLoad="setup();">
<audio id="audio"  src="Music/1.mp3"controls="controls" autoplay="autoplay"   align=""> </audio>
</body>