I've been developing a web application that allows the user to stamp and mark certain portions of an mp3 to play from, and as part of that application, I need to allow the user to load new files that can then be played in the browser. I've been trying this with the file and audio elements in HTML, but I can find a way to make the new selected file actually become the new source of the audio element. For example, I tried:
<audio id="song" controls>
<source src="C:\Users\dalzinm\Downloads\Jaco.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
<input type="file" id="myFile" name="theFile"/>
<script>
var input = document.getElementById("myFile");
input.onclick = function ()
{
this.value = null;
};
input.onchange = function ()
{
var song = document.getElementById("song");
song.pause();
song.src=input.value;
song.load();
song.play();
};
</script>
But this seems to give me an error and I'm now sure how else I could go about doing it. Any help would be greatly appreciated, thanks!