jwplayer在对话框中 - 播放器在关闭对话框窗口后不会再次显示

Question

我有一个内置的应用程序，该应用程序显示了页面上嵌入的视频。我已经设置了一个链接，当单击时，打开对话框窗口，使用JWPLAYER显示视频。第一个问题是，当您首先单击链接以打开对话框时，对话框窗口为空白，直到您实际单击它，然后视频显示并播放正常。第二个主要问题是，如果您关闭对话框窗口，然后单击链接重新打开它，则视频根本不会显示 - 即使您单击它，对话框窗口也完全空白。

我在JWPLAYER论坛和Stackoverflow上查看了类似的帖子，但找不到答案。Stackoverflow中有一个类似的问题，表明可以在JWplayer 6.10版中解决此问题，但我正在使用6.12.4956版本。如果有人可以看一下并给我一些建议，我会很感激。

这是我的代码：

<div id="video-player-container">
 <div id="video-player">{() (: This div is filled by the player :)}</div>
 <div id="video-player-modal">{() (: This div is filled by the player :)}</div>
  <script type='text/javascript'>
    var options = 
     {{
       playlist:
       [{{
        sources: [
         {{ file: '{$video-rtmp-href}' }},
         {{ file: '{$video-hls-href}' }}
       ],
         image: '{$image-href}'
       }}],
      width: '100%',
      height: '90%',
      aspectratio: '16:9',
      primary: "html5",
      stretching: "fill"
     }};   
       
     jwplayer('video-player').setup(options);   
    
     function dialogOpen() {{
      $("#video-player-modal").dialog({{
      resizable: true, 
      width: '65%',
      open: function(event, ui) {{
        jwplayer("video-player-modal").setup(options);
      }}
      }})
    }};
</script>
 <div>
 <a href="javascript:dialogOpen();">
  <img src="/images/video-resize.png"/>
 </a>
 </div>
</div>

Answer 1

我似乎已经通过将.remove（）方法添加到关闭事件的情况下解决了我的原始问题的第二个问题：

 function dialogOpen() {{
  $("#video-player-modal").dialog({{
    open: function(event, ui) {{
     jwplayer("video-player-modal").setup(options);
    }},
    autoOpen: true,
    resizable: true, 
    close: function(event, ui) {{
      jwplayer("video-player-modal").remove();
    }}
  }})
}};

但是，当您第一次单击链接打开对话框时，我仍然遇到问题，对话框窗口为空白，直到您实际单击它，然后视频显示并播放正常。有人对这个问题有任何想法吗？

Answer 2

您可能有兴趣使用此。

脚本：

https://github.com/emaxsaun/jwbox

演示：

http://www.pluginsbyethan.com/github/jwbox.html