0

我在一个网页上有 47 个 mediaelementjs 音频元素。当我打开页面时，他们都尝试预加载，蓝色的小进度条到处飞。他们中的一些人成功了，但其他人从未开始。其中每一个的 src 标记都指向我的 Dropbox 帐户上的一个 mp3 文件。当我点击那些从未开始的游戏时，他们不会玩。我想做的是，除非用户单击其中一个播放，否则它们都不会开始下载。

我尝试将 src 设置为 '' 并设置 onclick="this.src='the url'" 但这不起作用。它试图要求用户下载丢失的歌曲。

如果需要，我会尝试编码修复，但似乎应该有一种简单的方法来禁用预加载，直到你真的需要它来处理这种情况？有什么想法吗？

谢谢。

4

2 回答 2

0

我遇到了几乎相同的问题，我发现 mediaelementjs 在大多数浏览器上不支持多个实例。所以我为此使用了 UbaPlayer。如果这不可行，请尝试在每个音频标签上设置一个唯一递增的 id，如 player1、player2... 并像这样动态实例化它们：

var players = [];

$('audio').each(function(i){

    players[i] = new MediaElementPlayer('#player'+i, {
        features: ['playpause', 'progress'],
        audioWidth: 250, audioHeight: 30,
        success: function (mediaElement) { mediaElement.pause(); mediaElement.load(); }
    });
于 2013-02-11T20:31:02.123 回答
0

嘿，欢迎！

您的问题的简单答案是将 preload 参数放在每个音频标签中，如下所示：

<audio src="http://yourdropbox.mp3" preload="none"></audio>

这应该可以解决所有玩家一次加载的问题。

更长的答案是，对于大多数应用程序来说，一个页面上的许多播放器需要更多的工作才能让每个视频都能正常播放（相信我自己为此汗流浃背）。

首先，我相信前面提到的 preload 参数在 IE9 中没有任何作用。为了解决这个问题，我添加了强制 IE9 进入 shim 模式的代码。

$('audio').mediaelementplayer({ 
    /*@cc_on
    @if (@_jscript_version == 9)
    mode: 'shim',
    @end
    @*/
    plugins: ['flash','silverlight']
});

现在您应该可以在一个页面上拥有多个音频播放器，而不会出现任何加载问题。但是，您可能会发现，少数玩家仍然无法工作。这是因为当 mediaelement.js 被激活时，浏览器会发送一个下载每个音频文件的请求。它可能适用于快速的互联网连接，但在其他情况下会失败。因此，最好的解决方案是只显示一部分音频播放器，然后让用户单击一个按钮（或滚动到底部）以显示更多。

于 2013-03-07T23:19:40.747 回答