jPlayer - 使用setMedia()设置媒体URL

Question

jPlayer - 使用setMedia()设置媒体URL

3

我正在尝试在Firefox 3.6 (Ubuntu)下使用jPlayer。

function loadmedia() {
  $('#jquery_jplayer_1').jPlayer('setMedia', {
    mp3: 'media/audio/04-Piste_4_1.mp3',
  });
}

$(document).ready(function () {
  $('#jquery_jplayer_1').jPlayer({
    ready: loadmedia,
    swfPath: 'static/jPlayer',
    errorAlerts: true,
    supplied: 'mp3',
  });
});

但它告诉我：

jPlayer 2.1.0：id='jquery_jplayer_1'：错误！

尝试发出媒体播放命令，而未设置媒体URL。

请使用setMedia()设置媒体URL。

上下文：播放

并且无法播放文件。

您可以在这里查看在线示例。

- Pierre de LESPINAY

我已经尝试了很多次，但是无论是在Firefox 3.6.22还是Chromium 12中，我都无法让这个或任何实现工作。调试结果：Mp3文件在FF中不受支持，ready事件从未被调用。当我尝试打开另一种类型的文件时，即使是从源中，也会出现错误：Media URL could not be loaded.\nCheck media URL is valid.\n\nContext:http://example.com/file.mp3（FF和Chrome）。 - Rob W

我也尝试将“solution”属性更改为“flash，html”，以强制jPlayer使用flash，但是出现了相同的问题。当您手动多次启动“loadmedia（）”时，它可以正常工作。 - Pierre de LESPINAY

2个回答

0

您的代码中可能有错误导致了这种行为：

您的代码为：

mp3: 'media/audio/04-Piste_4_1.mp3',

应该是这样的

mp3: 'media/audio/04-Piste_4_1.mp3'

所以去掉逗号。

- user1733849

这不是语法错误，我总是在JavaScript对象的最后一个项目后包含逗号，以防我想添加另一个项目，这样我就不会忘记逗号。 - Dan Mantyla

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Mechlar · Accepted Answer

jPlayer的主要目的是让您可以使用HTML5和Flash回退，因此您应该利用FF和Chrome的HTML5，而不是依赖它回退到Flash。

Firefox不支持HTML5上的mp3，他们支持更好的ogg。我总是为每个浏览器格式化我需要播放的音频文件，这样当HTML5可用时，您就可以利用它，并且您的应用程序在加载音频文件时有更好的机会选择浏览器（并非所有浏览器都被加载，只有所需的浏览器）。

使用：.ogg适用于Chrome和Firefox，.m4a适用于Safari，.mp3适用于IE。请看这里转换您的音频文件，然后尝试这个：

function loadmedia(){
   $('#jquery_jplayer_1').jPlayer('setMedia', {
      oga: 'media/audio/04-Piste_4_1.ogg',
      m4a: 'media/audio/04-Piste_4_1.m4a',
      mp3: 'media/audio/04-Piste_4_1.mp3'
   });
}

$(document).ready(function () {
  $('#jquery_jplayer_1').jPlayer({
    ready: loadmedia,
    swfPath: 'static/jPlayer',
    errorAlerts: true,
    supplied: 'oga, m4a, mp3'//fyi, in your code you had a trailing comma here, that will break IE
  });
});

编辑：

在 jPlayer 的新音频演示页面上看到了这个链接：链接

请注意，设置 {wmode:"window"} 选项是为了确保在 Firefox 3.6 中使用 Flash 解决方案进行播放。然而，在此情况下将使用 HTML 解决方案与 OGA 格式。