使用jQuery将视频加载到JW Player中

Question

所以在JW Player之后我可以加载一个视频(很明显)它看起来像这样:

<script type="text/javascript" src="/scripts/jwplayer.js"></script>
<div id="myElement">Loading the player ...</div>
<script type="text/javascript">
    jwplayer("myElement").setup({
        file: "/uploads/example.mp4",
        height: 360,
        image: "/uploads/example.jpg",
        width: 640
    });
</script>

我试图完成这样的事情,一旦模态被触发(使用jQuery),在视频内加载一个视频:

$("body").on('click', '[data-toggle=modal]', function(e){
   var vid = $(this).attr('data-video');
   jwplayer("videoElement").setup({ file: vid, width: 540 });
   jwplayer("videoElement").play();
});

但是我收到错误: Uncaught TypeError: Cannot call method 'setup' of null

我尝试了以下其他(可能是可怕的)想法:

$("#videoElement").jwplayer.setup({ file: vid, width: 540 });

和

var $jwplayer = jwplayer();
$("body").on('click', '[data-toggle=modal]', function(e){
  $jwplayer("videoElement").setup({ file: vid, width: 540 });
}

然而,所有产生相同的结果 Cannot call method 'setup' of null

任何指针都将非常感激.

Answer 1

你在页面上没有videoElement只有myElement:

<div id="myElement">Loading the player ...</div>
<script type="text/javascript">
    jwplayer("myElement").setup({
        file: "/uploads/example.mp4",
        height: 360,
        image: "/uploads/example.jpg",
        width: 640
    });
</script>

你必须使用:

jwplayer("myElement").setup({ file: vid, width: 540 });