使用jquery和HTML5音频标记切换音频来源
我只找到一个其他解决方案,但它不完整,所以我需要帮助。使用jquery和HTML5音频标记切换音频来源
我有音频设置:
<audio id="player" controls="controls">
<source id="ogg_src" src="lib/audio/barger01.ogg" type="audio/ogg" />
<source id="mp3_src" src="lib/audio/barger01.mp3" type="audio/mp3" />
Your browser does not support the audio element.
</audio>
我有一个链接动态生成的表更改曲目:
<div id="audio_list">
<a href="#" class="track" data-location="http://www.newoggtrack.ogg">sample</a>
</div>
我有这个jQuery的,我不知道该怎么办与改变轨道
$('.track').click(function(){
load_track = $(this).attr('data-location');//gets me the url of the new track
change_track(load_track);// function to change the track of the loaded audio player without page refresh preferred...
});
我发现这个功能,但我没有用它正确的方式
function change_track(sourceUrl) {
audio.empty();
$("#ogg_src").attr("src", sourceUrl).appendTo(audio);
/****************/
audio[0].pause();
audio[0].load();//suspends and restores all audio element
/****************/
}
audio = $("<audio>").attr("id", "player")
.attr("preload", "auto");
你变函数应该是这样的:
function change(sourceUrl) {
var audio = $("#player");
$("#ogg_src").attr("src", sourceUrl);
/****************/
audio[0].pause();
audio[0].load();//suspends and restores all audio element
//audio[0].play(); changed based on Sprachprofi's comment below
audio[0].oncanplaythrough = audio[0].play();
/****************/
}
的问题是audio.empty()和音频变种。您试图追加一个空的音频标签,并没有将音频标签写回浏览器。
谢谢你的帮助。它清理了我做了什么,并像魅力一样工作。我希望我正确地授予赏金。 – 2012-03-06 21:16:05
解决了我的问题。似乎必须使用load()方法,否则即使DOM已更新,HTML播放器也不会实际加载声音。谢谢! – Shahar 2012-12-19 22:48:09
audio = $(“#player”) – 2013-12-04 23:53:07
您可能还想重命名该函数,因为'change'已经是jQuery Universe中的一个函数。
你的问题是什么?当您尝试切换时会发生什么?你有错误吗?并且'function change()'是直接复制和粘贴的代码,还是仅仅是你已经提取的代码片段? – Ktash 2012-02-27 19:32:06
更改功能是我找到的东西,但它不起作用。它现在抛出错误 – 2012-02-27 20:53:00
然后发布错误。如果他们不知道什么是错的,你希望人们如何帮助你? – bububaba 2012-02-29 12:34:13