Question

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

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

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

感谢。

Answer 1

我有几乎相同的问题，我发现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(); }
    });

Answer 2

嘿那里欢迎！

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

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

这可以解决所有玩家立刻加载的问题。

更长的答案是对于大多数应用程序而言，一页上的许多玩家需要更多的工作来让每个视频正常播放（相信我，我自己也为此感到高兴）。

首先提到前面提到的preload参数我认为在IE9中没有做任何事情。为了解决这个问题，我添加了强制IE9进入填充模式的代码。

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

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

麻烦在一个页面上有许多mediaelementjs音频元素

2 个答案: