setAttribute and video.src for changing video tag source not working in IE9

by

Great news, I found a true solution to switching/changing videos in HTML5 video tags via JavaScript without using the annoying hack I tried to explain! It’s unbelievably simple and it just took a LOT of experimenting with IE. Below is the code in its simplest form to work in IE:

<html>
  <body>
    <video id='videoPlayer' width="320" height="240" controls="controls">
       <source id='mp4Source' src="https://stackoverflow.com/questions/12151606/movie.mp4" type="video/mp4" />
       <source id='oggSource' src="movie.ogg" type="video/ogg" />
    </video>

<!-- You MUST give your sources tags individual ID's for the solution to work. -->

    <script>
      var player = document.getElementById('videoPlayer');

      var mp4Vid = document.getElementById('mp4Source');

      player.pause();

      // Now simply set the 'src' property of the mp4Vid variable!!!!

      mp4Vid.src = "/pathTo/newVideo.mp4";

      player.load();
      player.play();
    </script>
  </body>
</html>

And there you have it. Unbelievably simple — tested and working in IE8, and IE9…
If you are having any problems, please let me know.

More Related Contents:

  1. Why doesn’t indexOf work on an array IE8?
  2. forEach on querySelectorAll not working in recent Microsoft browsers
  3. Open links made by createObjectURL in IE11
  4. Can I load an entire HTML document into a document fragment in Internet Explorer?
  5. PNG transparency issue in IE8
  6. Running .exe from Javascript
  7. Alternative or polyfill for Array.from on the Internet Explorer
  8. Can’t set innerHTML on tbody in IE
  9. DOM refresh on long running function
  10. What are techniques to get around the IE file download security rules?
  11. Detect if HTML5 Video element is playing [duplicate]
  12. How can I detect browser type using jQuery?
  13. Support for ES6 in Internet Explorer 11
  14. Prevent Use of the Back Button (in IE)
  15. Is there something like “Firebug for IE” (for debugging JavaScript)?
  16. How to reference the caller object (“this”) using attachEvent
  17. How do you detect support for VML or SVG in a browser
  18. Accessing Multiple camera javascript getusermedia
  19. Chrome and IE sorts JSON Object automatically, how to disable this?
  20. Template literals syntax is not working in IE11
  21. How can I set preview of video file, selecting from input type=’file’
  22. JavaScript Troubleshooting Tools in Internet Explorer
  23. “Permission denied” with Internet Explorer and jQuery
  24. Getting selected text with CKEditor Plugin on IE
  25. IE6 Hover Issue
  26. Print PDF File in IFrame using javascript getting one page only
  27. setTimeout Internet Explorer
  28. Emulate clicking a link with Javascript that works with IE
  29. The best placeholder polyfil script for ie7, ie8 and ie9 [closed]
  30. doPostback failing in IE 11+ Windows 8.1

Leave a Comment