MediaElement.js使用相同的播放器播放音频和视频

时间:2012-02-12 12:18:28

标签: mediaelement.js

我正在尝试使用mediaelement.js设置播放器。 我正在实现我自己的自定义播放列表 - 我只想在页面上有一个播放器,并且在点击播放列表中的不同标题时,它必须自动更改播放器的来源。

我用相当简单的代码实现了这一目标。

这是初始化:

var player = new MediaElementPlayer("#audioplayer",
{
//if the <video width> is not specified, this is the default
defaultVideoWidth: 480,
// if the <video height> is not specified, this is the default
defaultVideoHeight: 270,
// if set, overrides <video width>
videoWidth: -1,
// if set, overrides <video height>
videoHeight: -1,
// width of audio player
audioWidth: 960,
// height of audio player
audioHeight: 30,
// initial volume when the player starts
startVolume: 0.8,
// useful for <audio> player loops
loop: false,
// enables Flash and Silverlight to resize to content size
enableAutosize: true,
// the order of controls you want on the control bar (and other plugins below)
features: ['playpause','progress','current','duration','tracks','volume','fullscreen'],

// automatically selects a <track> element
startLanguage: '',
// a list of languages to auto-translate via Google
translations: [],
// a dropdownlist of automatic translations
translationSelector: false,
// key for tranlsations
googleApiKey: '' }
);

这是在单击播放列表中的元素时更改src的代码。

document.getElementById('audioplayer').src = url;
  if(url.search('youtube')!=-1 || url.search('youtu.be')!=-1)
  {
    document.getElementById('audioplayer').pluginType="youtube";
    $('#audioplayer').attr("type","video/youtube");
  }
  else
  {
    document.getElementById('audioplayer').pluginType="native";
    $('#audioplayer').attr("type","audio/mp3");
  }
  player.load();
  player.play();

问题是播放器无法播放视频和音频源。我已经尝试更改所有参数,包括src,pluginType等。它只播放音频文件或视频文件。

任何人都可以帮我吗?我猜它与初始化有关 - 如MediaElement,AudioElement或VideoElement等。

提前致谢。

1 个答案:

答案 0 :(得分:1)

我最终只使用了两个播放器 - 将其中一个初始化为音频,另一个初始化为视频类型。显示另一个时隐藏一个玩家,反之亦然。这是我能想到的最简单的解决方案。