setAttribute和video.src用于更改在IE9中不起作用的视频标记源 [英] setAttribute and video.src for changing video tag source not working in IE9

查看:170
本文介绍了setAttribute和video.src用于更改在IE9中不起作用的视频标记源的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我确实读过每个stackoverflow线程,关于在IE9中通过javascript动态更改视频标记源,包括有用但未商定的帖子这里这里,但确实感觉还有另一种解决方案。以下是我正在尝试做的基本示例:

I have literally read every stackoverflow thread regarding changing the video tag source dynamically via javascript in IE9, including the useful but not agreed upon posts here and here, but do feel like there is another solution. Here is the very basic example of what I'm trying to do:

    var video = document.getElementById('video');
    //now, use either of the lines of code below to change source dynamically

    video.src = "nameOfVideo";
    //or use...
    video.setAttribute("src", "nameOfVideo");

这两行代码都被Internet Explorer彻底憎恨,特别是因为src绝对是使用简单的video.getAttribute检查后更改,即使IE实际上没有做任何事情来切换视频。

Both of these lines of code are hated thoroughly by Internet Explorer, notably because the src is most definitely being changeed after being checked with a simple video.getAttribute, even though IE is not actually doing anything to switch the video.

是的,有声称与IE,你必须将src与HTML一起列出,以便在页面加载后更改它们,但我确实在stackoverflow上找到了一个通过简单的JavaScript提出解决方案的线程。 (令我失望的是,我再也找不到这样做的线程....我到处搜寻,相信我。)

Yes, there are claims that with IE, you MUST have the src's listed with the HTML in order to change them after the page has loaded, BUT I have definitely found a thread on stackoverflow that proposed a solution via simple JavaScript. (To my disappointment, I can no longer find the thread that did so....and I've searched everywhere, believe me).

尽管如此,如果有人可以提供解决方案而不使用将所有视频src放在HTML中,而是使用JavaScript动态设置/创建src,如上所示,我将非常感激。

With all that said, if anyone can provide a solution WITHOUT the use of placing all of the video src's within the HTML and instead, dynamically setting/creating the src's using JavaScript as shown above, I would be extremely grateful.

(或者,如果你可以指向'缺少'溢出线程的方向,测试IE中是否存在属性,然后以某种方式通过javascript设置src,这也将不胜感激。)

(Or, if you could point me in the direction of the 'missing' overflow thread that tests if the attribute exists in IE, and then somehow set the src via javascript, that will also be appreciated).

推荐答案

好消息,我找到了一个真正的解决方案,通过JavaScript切换/更改HTML5视频标签中的视频,而不使用我试过的讨厌的黑客攻击说明!它简直令人难以置信,它只是对IE进行了大量的实验。以下是在IE中最简单形式的代码:

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="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>

你有它。令人难以置信的简单 - 在IE8和IE9中测试和工作...
如果您有任何问题,请告诉我。

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

这篇关于setAttribute和video.src用于更改在IE9中不起作用的视频标记源的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆