0

したがって、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

任意のポインタをいただければ幸いです。

4

2 に答える 2

8

ページに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 });
于 2012-12-06T13:24:57.530 に答える
1

このスクリプトを追加

<script>
var trigger = $("body").find('[data-toggle="modal"]');
trigger.click(function () {
   var vid = $(this).attr('data-video');
   jwplayer().load([{ file: vid }]);
   jwplayer().play();
});
</script>

次に、リンクを次のようにフォーマットします

<a href="#" data-toggle="modal" data-target="#videoModal" data-video="example.mp4">Video</a>
于 2015-04-15T00:16:38.707 に答える