在 ajax 加载部分页面上多次初始化 Video.js 播放器

Question

几个月前让-弗朗索瓦问过一个类似的问题，但我的问题更棘手。

我必须在名为“ajax 内容”的节点中加载不同的内容。
播放器第一次被初始化并且视频显示了它自己的控制栏皮肤。

但是，如果第二次加载另一部电影或同一部电影，则不会初始化和运行 Video.js 脚本。如果我使用“remove()”或“empty()”清除节点，也会发生这种情况。

这是外部 html 文件的一部分：

<div id="video">
<video id="html5_video" class="video-js vjs-ms-skin" autoplay controls preload>
    <source src="fileadmin/themen/de/iagos.mp4" type='video/mp4' />
</video>
<div class="ajaxLoadClose"></div>

这是 jQuery 脚本

$(".ajax-content").load(pfad+"#video",function(responce,status,xhr){
if (status=="success")
{

    _V_("html5_video");
    $(".ajax-content").css("display","block");
    $(".ajaxLoadClose").click(function() {
        var vidBig = $(this).parent().find("video").get(0);
        vidBig.pause();
        $(".ajax-content").fadeOut('slow', function() {
            $('.ajax-content').children().remove();
        });/**/
    });
}

});

有什么重置方式吗？谢谢你的帮助。

Answer 1

如果您在不转到新页面的情况下为每个视频创建一个新播放器，它将开始构建播放器实例，因为对播放器的引用_V_.players通过其 ID存储在对象中。如果您调用player.destroy()它将删除播放器引用。只要确保你没有任何其他东西引用玩家坚持。您还需要从页面中删除播放器 .video-js div。在以后的版本中， player.destroy() 函数也会这样做。

请参阅此进行详细讨论。:)