HTML5视频IE9与其他

您可以查看测试页面

我正在使用这个解决方案

我也在使用javascript库，正如在文章中提到的那样

问题是：页面加载良好，我可以使用Crome、FireFox和Safari中的下拉菜单将视频剪辑更改为播放。但由于某些原因，在IE9中，如果先前的视频在暂停状态下运行新的视频加载，则视频会更改为选中状态，即，它显示的不是“播放”按钮，而是“暂停”按钮状态

以下是我的代码：HTML：

<video id="vidScreen" width="624" height="260" preload="auto" controls="controls"></video>

Javascript：（对于下拉菜单中的canges：

function doMetaphors()

{

var v = new Array(); 

v["what"] = [ 
        "what/what.mp4", 
        "what/what.ogg", 
        "what/what.webm" 
        ]; 
v["bullet"] = [ 
        "bullet/bullet.mp4", 
        "bullet/bullet.ogg", 
        "bullet/bullet.webm" 
       ]; 
v["seven"] = [ 
        "seven/seven.mp4", 
        "seven/seven.ogg", 
        "seven/seven.webm" 
        ];

v["anderson"] = [
        "anderson/anderson.mp4", 
        "anderson/anderson.ogg", 
        "anderson/anderson.webm"
        ];

v["smith"] = [
        "videos/video3.webmvp8.mp4", 
        "videos/video3.theora.ogg", 
        "videos/video3.mp4video.webm"
        ];

v["everything"] = [
        "everything/everything.mp4", 
        "everything/everything.ogg", 
        "everything/everything.webm"
        ];


var menuID = window.document.getElementById("metaphorsStyle");

var getDestination = menuID[menuID.selectedIndex].value;

var targetMovie = window.document.getElementById("vidScreen");

if (Modernizr.video && Modernizr.video.h264)
{
    targetMovie.setAttribute("src", v[getDestination][0]);
}
else if (Modernizr.video && Modernizr.video.ogg)
{
    targetMovie.setAttribute("src", v[getDestination][1]);
}
else if (Modernizr.video && Modernizr.video.webm)
{
    targetMovie.setAttribute("src", v[getDestination][2]);
}

//targetMovie.load();
}

我注释掉了targetMovie.load（）；它似乎没有必要，但即使如此，它也不起作用

我亦曾考虑：

targetMovie.addEventListener('loadeddata', initialiseControls, false);

因此，在initialiseControls中，我可以切换播放/暂停按钮，但在web上找不到任何信息

希望我的问题是明确的，不要太长

我真的很想在这方面得到一些帮助

多谢各位

---

新闻：我现在已使下拉菜单中的所有选项正常工作，因此您可以选择任何项目并见证我试图在IE9中纠正的行为。再次感谢您。

有一个属性，您可以检查播放机是否暂停。更新播放机的控件总是更好的。在您的情况下，我将听“loadeddata”，然后检查videoplayer状态并更新控件。因此，请尝试：

//loadeddata = (new) video-source loaded
targetMovie.addEventListener('loadeddata', function(){    

    if(targetMovie.paused){   //get videoplayer state (true | false)
      showPlayButtonAndHidePauseButton();
    }
    else
    {
      hidePlayButtonAndShowPauseButton();
    }
});

---

希望它能起作用。顺便说一句：这里有一个很好的html5视频元素所有事件/属性的现场演示：

有一个属性，你可以检查播放器是否暂停。最好从播放器更新控件。在你的情况下，我会听“loadeddata”，然后检查视频播放器状态并更新控件。so尝试：

//loadeddata = (new) video-source loaded
targetMovie.addEventListener('loadeddata', function(){    

    if(targetMovie.paused){   //get videoplayer state (true | false)
      showPlayButtonAndHidePauseButton();
    }
    else
    {
      hidePlayButtonAndShowPauseButton();
    }
});

---

希望它能起作用。顺便说一句：这是一个很好的html5视频元素所有事件/属性的现场演示：

我试过了，它说：ShowPlayButton和HidePauseButton（）；不是一个函数。我遗漏了什么吗？用“ShowPlayButton和HidePauseButton（）”来评论#1:我的意思是，这是应该编写逻辑的地方。因此，用更新控件的方式替换函数，例如myPauseButton.hide（）；myPlayButton.show（）建议2：除了ie，应该怎么说？…解决方法仍然有效是的，这是我之前理解的。我想从浏览器提供的默认播放器开始。有没有办法访问默认播放器界面中的播放/暂停按钮？啊，对不起，我想你已经实现了自己的控件。好吧，这是定义etly是一个ie bug！在这种情况下，你可以（仍然在loadeddata方法中）调用targetMovie.play（）；targetMovie.pause（）；这会启动和停止播放器，控件应该更新我尝试过它，它说：ShowPlayButton和HidePauseButton（）；不是一个函数。我缺少什么吗？用“ShowPlayButton和HidePauseButton（）”注释#1:我的意思是，这是应该编写逻辑的地方。因此，用更新控件的方式替换函数，例如myPauseButton.hide（）；myPlayButton.show（）建议2：除了ie，应该怎么说？…解决方法仍然有效是的，这是我之前理解的。我想从浏览器提供的默认播放器开始。有没有办法访问默认播放器界面中的播放/暂停按钮？啊，对不起，我想你已经实现了自己的控件。好吧，这是定义etly是一个ie bug！在这种情况下，您可以（仍然使用loadeddata方法）调用targetMovie.play（）；targetMovie.pause（）；这将启动和停止播放机，并且控件应该更新