使用jQuery控制HTML5 <audio>元素</audio>

时间:2012-03-06 08:06:32

标签: javascript jquery html5 audio

我正在尝试使用jQuery来控制HTML5音频元素,但我不是JS的天才。 我想要的是让玩家从页面加载开始,我已经完成了,但是当点击播放按钮时,我想检查音频是否正在播放。 如果单击时正在播放:停止音频。 如果单击时没有播放:播放音频。

如果你能提供帮助,我们将不胜感激。

来源:http://www.julake.co.uk/media/loader.php?page=contact

非常感谢,

3 个答案:

答案 0 :(得分:12)

您应该使用单个播放/暂停切换按钮,您需要检查音频是否暂停

var audioplayer = document.getElementById("audio-player");
$("#play-bt").click(function(){
    if (audioplayer.paused) {
       audioplayer.play();
    }   
    else {
       audioplayer.pause();
    }
    $(this).toggleClass('pause');  /* style your toggle button according to 
                                      the current state */
})

答案 1 :(得分:2)

var audio = new Audio("http://www.w3schools.com/html5/song.ogg"); //or you can get it with getelementbyid

audio.addEventListener('canplay', function() {
//code, when audio can play
audio.play(); //this function will start the music
})

使用audio.play()函数可以启动它。你不需要JQuery

答案 2 :(得分:1)

如果您希望使用jquery选择器或者已经有jquery选择器,可以添加[0]来获取本机dom元素。

所以实际使用jquery的例子是。

$('audio')[0].pause()