Javascript 在关闭时停止 HTML 5 视频

Javascript to stop HTML 5 video upon close

本文关键字:HTML 视频 Javascript      更新时间:2023-09-26

我完全是编码新手,正在Adobe Edge Animate中从事一个项目。我创建了一个返回按钮,使用户能够在视频播放时单击它,从而关闭视频并将它们返回到主菜单。这有效,但是,视频音频继续在后台播放。

有谁知道我如何让视频在返回主菜单的同时暂停播放?

这是我的代码

(function ($, Edge, compId) {
    var Composition = Edge.Composition,
        Symbol = Edge.Symbol; // aliases for commonly used Edge classes
    //Edge symbol: 'stage'
    (function (symbolName) {
        Symbol.bindTriggerAction(compId, symbolName, "Default Timeline", 1000, function (sym, e) {
            // sym.$("name") resolves an Edge Animate element name to a DOM
            // element that can be used with jQuery
            var vid = sym.$("Rectangle");
            vid.html('<video width="1920" height = "1080" src = "video/OurChangingWorld_AirQuality_Final_v2.mp4" type ="video/mp4" controls autoplay></video>');
        });
        //Edge binding end
        Symbol.bindTriggerAction(compId, symbolName, "Default Timeline", 0, function (sym, e) {
            sym.stop();
        });
        //Edge binding end
        Symbol.bindElementAction(compId, symbolName, "${_Button_AirQuality}", "click", function (sym, e) {
            sym.play("Video 1");
        });
        //Edge binding end
        Symbol.bindElementAction(compId, symbolName, "${_Return_button-01}", "click", function (sym, e) {
            sym.play("Main");
        });
        //Edge binding end
    })("stage");
    //Edge symbol end:'stage'
})(jQuery, AdobeEdge, "EDGE-3854874");

似乎您只是隐藏了视频实例。所以它一直在播放。要控制视频实例,您只需向视频代码添加 id 属性,如下所示:

vid.html('<video id="myvideo" width="1920" height = "1080" ...

之后,您可以使用标准 jQuery 选择器获取对先前创建的视频实例的引用来控制它(播放/停止/暂停/删除它):

$("#myvideo").pause();

在这里,您将找到HTML5视频/音频API的有用说明:http://www.w3schools.com/tags/ref_av_dom.asp

希望有帮助。快乐动画,

西蒙