停止html5视频和swf播放器播放时，标签是失去焦点

Question

我使用html5视频(html5media.com)内的选项卡(jQuery UI选项卡)。当视频播放在旧的IE浏览器，它回落到Flowplayer (swf播放器)。

我的问题是每当我选择不同的选项卡时，视频在失焦时继续播放。

感谢这里的人早些时候帮助我，我能够在所有浏览器中播放视频暂停，除了IE 8和更早的版本，当使用下面的语法:

JS:

$('#tabs').tabs({
    select: function(event, ui) {
        if (ui.tab.id != 'videos') {
        $("#myvid")[0].pause();
        }
    }
});

还有，这是我的HTML:

<div id="videos"> 
<div id="VideoContainer"> 
<video id="myvid" poster="img/poster-showreel.jpg" width="470" height="265" fullscreen="true" controls preload> 
<source src="showreel.mp4"></source> 
<source src="showreel.webm"></source> 
</video> 
</div> 
</div> 

问题是，现在IE踢回一个错误('对象不支持此属性…')，因为它使用基于flash的播放器。

当标签不再被选中或聚焦时，如何阻止视频播放(在所有浏览器中)?

,
如果你是版主，想要删除这篇文章，请解释原因。我认为这是一个合法的问题，但我没有找到一个直接的答案，包括所有浏览器的解决方案。

Answer 1

你将不得不停止flash播放器以及使用javascript。Flowplayer自带api，一旦在您的网站上启用，将允许您直接通过javascript修改flash视频。到这里，下载文件并将其包含在标题中。一旦完成，你可以在javascript中添加一行来停止flowplayer:

$('#tabs').tabs({
    select: function(event, ui) {
        if (ui.tab.id != 'videos') {
        $("#myvid")[0].pause();
        // get a handle to the flowplayer and stop it
        $f().stop();
        }
    }
});

Answer 2

如果同时调用，可能仍然会出现错误…添加对swf的检查。

$('#tabs').tabs({
        select: function(event, ui) {
            if (ui.tab.id != 'videos') {
              if ( $("'"+ui.tab.id+" object'").length >= 1 ){ 
                // get a handle to the flowplayer and stop it
                $f().stop();
              } else {
                $("#myvid")[0].pause();
              }
            }
        }
    });