Search code examples
javascripthtmlaudiointernet-explorer-11html5-audio

IE11 audio tags not working after various ad hoc workarounds

This question has been asked and solved various times, but the fixes I've found on SO haven't been working for me so now it is my turn to ask.

My audio tags work just fine in chrome and Edge, but not IE11.

In the advanced media settings I have play web audio enabled, I have this in my head tag although probably not necessary: <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> I have <!DOCTYPE html> at the top with no comments above or whitespace. My audio tags are created as such:

$("body").append($("<audio id='<%=aCodeElement.getDescription()%>'> <source src='<%=aCodeElement.getCode()%>' type='audio/mpeg'></audio>"));

And in the browser they look like:

<audio id="RingTone01"> 
    <source src="http://10.37.0.102/console/sounds/ringtones/Ring-Tone-01.wav" type="audio/mpeg">
</audio>

They are triggered as follows:

for(var i = 0; i < soundlist.length; i++)
        {
            if (soundlist[i] == tone)
            {

                 document.getElementById(soundlist[i]).play();
                 
                
            }
        }

I've ran the debugger to ensure that IE11 can find the right element, but it does not play the audio. Typing in something like

var audioelem = document.getElementById("RingTone01");
audioelem.play();

Console just says undefined and no audio plays. Any help would be greatly appreciated.

And one last thing, html5test.com says my internet explorer has no Web Audio API, whereas chrome does, so perhaps this might point to something.

Solution

  • IE11 doesn't support wav files, so I created a test mp3 file and the audio tag worked.