javascript - IE HTML5 audio files hang on windows localhost - works in all other browsers and on web

12

I have mp3 audio files which work flawlessly in firefox & chrome. In ie 10 and 11 they also work flawlessly on my live website.

However, suddenly on a Windows 7 localhost a sample file will work fine in one instance but the next, the audio control hangs. For example, the following code worked with a file 1.mp3. I copied 1.mp3 (also tried with rename) to some-other-name.mp3 and it would not work - just hangs with the control visible. I cleared website data and temp files but no luck. I renamed the file back to 1.mp3 and now it no longer works. What could be going on? It was working in ie 10 before it auto updated itself to ie 11. I uninstalled the update and am back to ie 10, but this didn't help. Again, on my live site, everything works, even in ie. Driving me crazy.

I've have code to completely take javascript out of the equation. Even with javascript disabled, it still freezes. Something is up with IE but what? Is this codec hell?

<table>
  <td><a href="?mp3file=1.mp3". onClick="CreateAudio('1.mp3', 'divid'); return false;">Play</a></td>
  <td><div id="divid"></div></td>
</table>

<?php
  if (isset($_GET['mp3file'])){
    // only here if javascript disabled
?>
    <audio id="audioplayer" preload controls autoplay >
          <source src="<?php echo $_GET['mp3file']; ?>" type="audio/mpeg">
    </audio>
<?php
}      
?>

<script type="text/javascript">
currentAudioPlayerID="";
function CreateAudio(mp3file, id){
  // remove old player
  if (currentAudioPlayerID!=""){
    var oldaudio = document.getElementById("audio-" + currentAudioPlayerID);
    oldaudio.parentNode.removeChild(oldaudio)    
  };

  // add new player
  currentAudioPlayerID=id;
  var audio = document.createElement('audio');

  var source= document.createElement('source');
  source.type= 'audio/mpeg';
  source.src= mp3file;
  audio.appendChild(source);

  oggfile = mp3file.replace(".mp3",".ogg");
  source= document.createElement('source');
  source.type= 'audio/ogg';
  source.src= oggfile;
  audio.appendChild(source);

  audio.setAttribute("id", "audio-"+id)
  var div = document.getElementById(id);
  div.appendChild(audio);

  audio.load;
  audio.play();
  audio.controls = true;
  audio.autoplay="True"
  audio.
}
</script>

People are also looking for solutions to the problem: php - Error getting the URL of a specific post

Source

Didn't find the answer?

Our community is visited by hundreds of web development professionals every day. Ask your question and get a quick answer for free.

Ask a Question

Write quick answer

Do you know the answer to this question? Write a quick response to it. With your help, we will make our community stronger.

Similar questions

Find the answer in similar questions on our website.