从javascript控制quicktime电影在IE中不起作用

时间:2011-10-20 13:41:36

标签: javascript internet-explorer-8 embed quicktime

我在控制javascript的quicktime电影时遇到了问题。我使用<video> HTML5元素在我的HTML页面中嵌入了一个视频 - 如果浏览器不支持它,则回退到quicktime(例如IE 8)(我有一个特定的要求是“no flash”,但quicktime是允许)。视频以弹出方式显示;当弹出窗口关闭时,我想停止视频播放。我可以在HTML5中成功完成此操作,但是quicktime控件无效。

我的HTML看起来像这样:

<video width="360" height="298" autobuffer="autobuffer" controls="controls" id="video" tabindex="0">
    <source type="video/mp4; codecs=&quot;avc1.42E01E, mp4a.40.2&quot;" src="/data/mmg-demo.mp4"></source>
    <source type="video/ogg" src="/data/mmg-demo.ogv"></source>
    <object width="360" height="298" id="videoem" codebase="http://www.apple.com/qtactivex/qtplugin.cab" classid="clsid:02bf25d5-8c17-4b23-bc80-d3488abddc6b">
        <param value="/data/mmg-demo.mp4" name="src">
        <param value="false" name="autoplay">
        <param value="true" name="controller">
        <embed width="360" height="298" name="videoem" pluginspage="http://www.apple.com/quicktime/download/" loop="false" controller="true" autoplay="false" src="../files/380/380523/video.mp4">
    </object>
</video>

弹出关闭javascript函数如下所示:

function closePopup {
    //stop html5 playback if it's there
    if(typeof document.getElementById('video').pause == 'function') {
        document.getElementById('video').pause();
    }
    //stop playback of quicktime embed if it's there
    if(document.getElementById('videoem')) {
        document.getElementById('videoem').SetRate(0.0);
    }
    $('#demo-video').fadeOut();
}

我在firefox中测试过这个完全相同的quicktime代码 - 它运行正常。此外,声称有效的其他论坛中的示例在IE 8中不起作用(例如,见http://lists.apple.com/archives/quicktime-api/2008/Mar/msg00187.html - 在IE 8中不起作用。)

document.getElementById('videoem').SetRate(0.0)导致Object does not support this property or method错误。

我不确定在哪里可以看。非常感谢任何帮助。

1 个答案:

答案 0 :(得分:1)

好的,我想我已经明白了。诀窍是使用<embed>元素中的ID而不是<object>元素。所以我得到的最终(工作)代码就是这个。

HTML:

<div id="mkt-video" style="position:fixed;width:360px;background-color:black;padding:10px;border:solid 2px white;display:none;z-index:100003">
    <video id="video" width="360" height="298" controls="controls" autobuffer="autobuffer">
        <source src="/data/mmg-demo.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' />
        <source src="/data/mmg-demo.ogv" type="video/ogg" />
        <object classid='clsid:02bf25d5-8c17-4b23-bc80-d3488abddc6b' width="360" height="298" codebase='http://www.apple.com/qtactivex/qtplugin.cab' id="videoem-object">
            <param name='src' value="/data/mmg-demo.mp4" />
            <param name='autoplay' value="false" />
            <param name='controller' value="true" />
            <param name="enablejavascript" value="true" />
            <embed src="../files/380/380523/video.mp4" width="360" height="298" autoplay="false" controller="true" loop="false" pluginspage='http://www.apple.com/quicktime/download/' name="videoem" id="videoem"></embed>
        </object>
    </video>
</div>

和Javascript:

function closeVideo() {
    if(typeof document.getElementById('video').pause == 'function') {
        document.getElementById('video').pause();
    }
    try {
        document.getElementById('videoem-object').SetRate(0.0);
    }
    catch (err) {}
    $('#mkt-video').fadeOut();
}

“try-catch”是必需的,因为IE9仍会创建嵌入对象,但是会出现一些奇怪的类型并引发一些奇怪内容的错误。无论如何,它现在工作正常。