弹出形式的 JW 播放器：播放器在第二次弹出时不加载答案

【问题标题】：JW Player in the form of a popup: Player doesn't load on second pop弹出形式的 JW 播放器：播放器在第二次弹出时不加载
【发布时间】：2011-12-20 16:43:53
【问题描述】：

所以，我正在尝试制作一个带有缩略图的单页列表，当您点击它们时..video 基本上会弹出。我正在使用最新的 JW Player (5.8) 和最新的 jQuery 作为播放器。

一切都很好，但是，只有在第一个“pop”时。当我关闭我的第一个“pop”并打开一个新视频时，播放器不会加载。

我首先，问题是，我 .remove()'ing 播放器容器（出于显而易见的原因，视频不会在背景上继续播放和/或视频不会混淆一般来说）。然而它不是.remove()。

我用来弹出视频的插件功能是：

$.fn.AllfilmVideoPopper = function () {
    return this.each(function () {
        var permalink = $(this);

        $(permalink).click(function () {
            $('body').append(
                $body_overlay = $('<div class="body_overlay" />').append(
                    $wrapper = $('<div id="video_popper_wrapper">').append(
                        $closing_button = $('<div id="video_close" />'),
                        $player = $('<div id="video_popper" />')
                    ).centerit()
                )
            );
            $body_overlay.fadeIn();

            jwplayer("video_popper").setup({
                flashplayer: vp_video_player,
                file: 'http://www.youtube.com/watch?v=WrjwaqZfjIY',
                width: 800,
                height: 400,
                skin: vp_video_skin
            });

            $closing_button.click(function () {
                $body_overlay.fadeOut('fast', function () {
                    // $player.remove();
                })
            });

            return false;
        });

    });
};

^{代码仍然是原始的，因为我正在开发它。只有一个测试视频}

注意： vp_video_player 和 vp_video_skin 是预定义的 JW Player 文件相关参数，主要包括 CMS 到 player.swf 的主题位置和皮肤位置。

【问题讨论】：

标签： jquery popup jwplayer

【解决方案1】：

所以我所做的是创建了一个独立页面，其中包含 JW Player。里面只有 PHP，$_GET['vid'] 到 source-file-video-file-url。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Video</title>
    <style>
        html, body {height: 100%; margin: 0px; padding: 0px; background: #000000;}
    </style>
    <script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript" src="jwplayer.js"></script>
</head>
<body>
    <div id="player"></div>
    <script type="text/javascript">
        jwplayer("player").setup({
            flashplayer: "player.swf",
            file: "http://www.youtube.com/watch?v=<?= $_GET['vid'] ?>",
            width: 800,
            height: 400,
            skin: "glow.zip"
        });
    </script>
</body>
</html>

然后我修改了启动器脚本的第一行：

$player = $('<div id="video_popper" />')

到

$player = $('<iframe src="iframe.php?vid=' + vid + '" id="video_popper"></iframe>')

然后把原来的player-loading-function全部去掉了 jwplayer("video_popper").setup(); // 等等..

它基本上看起来像我最初想要的那样工作。并且不需要预先生成隐藏在背景内容上，因为 iframe 已经过时了，但本质上仍然是动态的。

在这里查看它的工作原理：http://www.alta.ee/groomlake/jw-player-popup-problem/video-list.html

【讨论】：