如何使用youtube视频更改源和加载媒体播放器?

时间:2012-07-09 00:47:14

标签: mediaelement.js

我正在尝试构建播放列表,当第一个视频结束时,我正在更改源并调用呼叫加载。这在html5模式下对我不起作用。有什么建议吗?

1 个答案:

答案 0 :(得分:1)

youtube pluginApi的setSrc方法不存在或不正确:https://github.com/johndyer/mediaelement/issues/381

您必须直接从pluginApi中调用loadVideoByUrl()或loadVideoById():

var myVideoPlayer = new MediaElementPlayer('#elementId');
myVideoPlayer.media.pluginApi.loadVideoById('myYoutubeId');

或者创建一个扩展“media”索引的插件,并添加setSrc()来调用其中一个方法:

/* global mejs */

(function($) {
    $.extend(MediaElementPlayer.prototype, {
        buildmyyoutube: function(player, controls, layers, media) {
            if (!player.isVideo || media.pluginType !== 'youtube') {
                return;
            }

            $.extend(media, {
                /**
                 * mejs' youtube plugin's setSrc doesn't support youtube urls (the flash one does)
                 * 
                 * @param string urlOrId Can either be a youtube url http://www.youtube.com/watch?v=<YoutubeId>
                 *                       or directly a youtube id
                 */
                setSrc: function (urlOrId) {
                    var queryStr = urlOrId.match(/v=([^&]*)/);
                    var id = urlOrId;

                    if(queryStr !== null) {
                        id = queryStr[1];
                    }
                    this.pluginApi.loadVideoById(id);
                }
            });
        }
    });
})(mejs.$);

var myVideoPlayer = new MediaElementPlayer('#elementId', {features: ['myyoutube']});
myVideoPlayer.setSrc('myYoutubeId');
myVideoPlayer.setSrc('http://www.youtube.com/watch?v=myYoutubeId');

我没有按原样测试它,我不得不从我使用的一些代码中编辑它,但它应该可以工作。