如何使用异步getJSON数据管理videojs的多个实例?

时间:2018-06-21 09:07:40

标签: javascript jquery video.js

我使用getJSON加载JSON文件列表。 我的示例不起作用:

$.getJSON("https://server.com/",
    function (data) {
        var courent_id = 0;
        $.each(data, function (key, value) {
            courent_id = courent_id + 1;
            $(".video-js-tile").push("<video id='multi_video" + courent_id + "' class='video-js' controls></video>");
            var video_player = videojs('multi_video' + courent_id);
            video_player.src({
                type: "video/mp4",
                src: 'https://server.com/video/' + value.video + '.mp4'
            });
        });
        $(".video-js").each(function (videoIndex) {
            var videoId = $(this).attr("id");
            videojs(videoId).ready(function () {
                this.on("play", function (e) {
                    //pause other video
                    $(".video-js").each(function (index) {
                        if (videoIndex !== index) {
                            this.player.pause();
                        }
                    });
                });
            });
        });
    }
)

我无法指定视频的来源。

如何使用异步 getJSON 数据管理 video.js 的多个实例?

谢谢。

1 个答案:

答案 0 :(得分:0)

使用:

$('.videme-tile').append("<video id='tile_multiple_video" + courent_id + "' class='video-js' controls  preload='auto' width='220' height='100'></video>");