我在一个页面上有多个音频播放器,每个播放器都有一个播放和停止按钮。我遇到的唯一问题是,当您单击一个播放按钮,然后单击另一个播放按钮时,它们会在彼此之上播放。有人可以帮助我编写代码,当单击另一个播放按钮时我需要停止正在播放的任何歌曲 - 所以一次播放的歌曲永远不会超过一首?谢谢!这是我的代码:
$(document).ready(function(){
$("#play-bt").click(function(){
$("#audio-player")[0].play();
})
$("#stop-bt").click(function(){
$("#audio-player")[0].pause();
$("#audio-player")[0].currentTime = 0;
})
})
$(document).ready(function(){
$("#play-bt1").click(function(){
$("#audio-player1")[0].play();
})
$("#stop-bt1").click(function(){
$("#audio-player1")[0].pause();
$("#audio-player1")[0].currentTime = 0;
})
})
最佳答案
$(document).ready(function(){
var allAudioEls = $('audio');
function pauseAllAudio() {
allAudioEls.each(function() {
var a = $(this).get(0);
a.pause();
});
}
$("#play-bt").click(function(){
pauseAllAudio();
$("#audio-player")[0].play();
})
$("#stop-bt").click(function(){
$("#audio-player")[0].pause();
$("#audio-player")[0].currentTime = 0;
})
$("#play-bt1").click(function(){
pauseAllAudio();
$("#audio-player1")[0].play();
})
$("#stop-bt1").click(function(){
$("#audio-player1")[0].pause();
$("#audio-player1")[0].currentTime = 0;
})
})
关于html - 一次只允许播放一个音频元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4196979/