在播放时预加载html5音频

Question

对于HTML5音频，假设您有两首要播放的歌曲的列表。目前我对它进行了设置，当当前歌曲停止播放时，它会加载新歌曲并播放它。我想让它在当前歌曲结束时加载下一首歌曲，可能在当前歌曲结束前20秒。我试图在歌曲播放时更改音频对象的src属性，但这会立即停止当前歌曲的播放。有没有其他方法可以让我在播放当前歌曲的同时预加载下一首歌曲？

Answer 1

您可以使用jQuery创建jQuery对象：

var nextSong = document.createElement('audio'); //Creates <audio></audio>
nextSong = $(nextSong); //Converts it to a jQuery object
$(nextSong).attr('autoplay') = false; //You don't want this dynamically loaded audio to start playing automatically
$(nextSong).attr('preload') = "auto"; //Make sure it starts loading the file
$(nextSong).attr('src') = url_to_src; //Loads the src

这将开始将歌曲加载到浏览器内存中的一个元素中，当歌曲结束时，调用类似于：

$(audio).replace(nextSong);

这是未经测试的。您甚至可能不需要jQuery。

这可以在没有jQuery的情况下工作：

var nextSong = document.createElement('audio');
nextSong.autoplay = 'false';
nextSong.preload = 'auto';
nextSong.src = url_to_src;

试一试，让我知道！

Answer 2

这可能有些离谱，但是您是否尝试过调用元素的load()方法呢？

http://www.whatwg.org/specs/web-apps/current-work/multipage/video.html#loading-the-media-resource

编辑：

啊，我想我误解了这个问题。您想在同一媒体元素中背靠背播放两首歌曲吗？我不确定这有多可行...将每首歌曲放在它自己的Audio元素中可能会更容易。如果你担心灵活性，你总是可以动态地生成它们。