如何成功摧毁一个MediaElementPlayer，并创建一个新的

这里的情景：如何成功摧毁一个MediaElementPlayer，并创建一个新的

我有一个包含被设置了一个视频video元素的网页。此视频的来源可能是包含多个来源（以及Flash后备）的HTML5视频或YouTube视频。下面是一些用作视频缩略图的图像，通过销毁现有MediaElementPlayer并在同一video元素上创建一个新视频缩略图，单击其中一个应加载相应的视频。

这将创建在页面加载初始玩家：

$('video').mediaelementplayer({ alwaysShowControls: true });

，这是意在改变播放器时，被点击的图像之一：

$('video').mediaelementplayer({ 
    alwaysShowControls: true, 
    success: function(media, dom, player) { 
     console.log('success!'); 
    }, 
    error: function() { 
     console.log('error!'); 
    } 
});

但它不工作。从不输入success函数（既不是error）也不会出现任何内容。

我猜库仍然认为原作的玩家存在，或什么的，并尝试了一些东西，试图告诉它这是不是这种情况，例如：

mejs.meIndex = 0 
mejs.players = []

为了不效果和设置：

window.mejs = null; 
window.MediaElementPlayer = null; 
window.MediaElement = null;

刚刚打破的东西:)

任何人都可以在那里帮助？我确信我在这里错过了一些简单的东西，所以如果有人能指出什么，我会非常感激！提前致谢。

来源

2012-06-29 Ian Devlin

我要在这里回答我的问题了谁比谁可能会遇到同样的问题，并且偶然发现此条目。

事实证明，我想要做的是不支持我的MediaElementJS在撰写本文时。

我的解决方案是创建两个播放器，一个用于HTML5/Flash视频，另一个用于YouTube视频，根据需要显示并隐藏相应的播放器。

来源

2012-11-30 09:02:13

我有同样的问题，并最终在使用mediaelementplayer（）初始化视频之前存储原始视频标记html。当我想切换视频我的jQuery（“母公司”）空（）的视频破坏mediaelementjs创建的所有元素的父元素，然后使用还原原始视频html和重新初始化：

$("#video").mediaelementplayer({ 
    pauseOtherPlayers: false 
});

我有点哈克但是完成这项工作。我很想知道你是否找到了更好的方法来做到这一点？

来源

2012-07-30 02:12:08 John

我认为最好的方式来改变当前播放的视频是MediaElementJS不是销毁它并重新创建它，而是使用内置视频“src”属性来更改源。

使用MediaElementJS API访问此“src”属性是更好的方式来管理跨浏览器的跨源问题（例如YouTube视频或Flash后备）。这是我做过的方式：

player.pause(); 
player.setSrc(myNewSourceURL); 
player.load();

我也把这个代码放到一个MediaElementJS插件，将有很多的好东西像周围的播放列表管理，Next和Prev按钮和播放列表面板。你可以找到the pullRequest on github。

下面是一个代码示例建立一个播放列表：

new MediaElementPlayer('#myvideo', { 
    features : ['prev','playpause','next', 'progress'], 
    success : function(mediaElement, domObject){ 
     domObject.player.loadPlaylist([ 
      {src: "http://domain.com/video/video1.mp4"}, 
      {src: "http://domain.com/video/video2.mp4"}, 
      {src: "http://domain.com/video/video3.mp4"}, 
     ]); 
    } 
});

然后，点击缩略图时：

var index = 2; // calculate the item index in the playlist 
player.setItem(index);

来源

2012-11-29 08:53:22

当你想这不工作的HTML5视频源和YouTube视频之间切换。图书馆的创建者确认不支持这种开关。 –

您可以使用medialementjs的remove()方法，设置video元素的类型和src属性，然后在视频类型发生更改时重新初始化mediaelementjs。

可能是这个样子：

function setSource(url, type) { 
    var vid = $('#video').first(); 
    if (vid.attr('type') != type) { 
     vid.get(0).player.remove(); 
     vid.attr('type', type).attr('src', url); 
     vid.mediaelementplayer({ 
      success: function(media, dom, player) { 
       player.play(); 
      } 
     }) 

    } 
}

如果你不只有MP4和YouTube，你可以在需要的时候只有重新初始化添加额外的逻辑。对我来说很完美。

来源

2013-08-25 20:47:45 Nic

而不是'remove（）'你的代码示例调用'destroy（）'（mediaelement.js不支持） – schellmax

你是对的，谢谢你的提示。修复它在我的答案。 – Nic

+1用于维护;） – schellmax

如果您需要切换不同类型的视频src，您需要销毁播放器并创建一个新的。

摧毁球员：

try(){ 
    player.pause(); 
    player.remove(ture); 
} catch(err) { 
    console.log(err); 
}

来源

2015-01-30 05:05:28

如何成功摧毁一个MediaElementPlayer，并创建一个新的

回答

相关问题