如何在下一个播放器启动时自动停止HTML5音频播放器

时间:2014-08-05 15:25:51

标签: javascript html5 html5-audio

我对JavaScript没有太多了解。

我用一些html5播放器创建了一些网站。现在我的问题是,当一个播放器播放一首歌时,当下一个播放器播放一首歌时它不会停止。目前我用“点击”停止播放器。我使用这段代码:

<button id="play<?= $i ?>" class="btn-icon-play" onclick="document.getElementById('player<?= $i ?>').play()"></button>
<button id="stop<?= $i ?>" class="btn-icon-stop hidden" onclick="document.getElementById('player<?= $i ?>').pause()"></button>
<audio id="player<?= $i ?>" src="<?= $music['url'] ?>"></audio>

有人能帮助我吗?

1 个答案:

答案 0 :(得分:0)

在播放按钮中添加此代码。它会立即暂停所有视频,然后播放所选的音频。

var audioList = document.getElementsByTagName('audio');
for(var i = 0; i < audioList.length; i++){
    if(audioList[i].tagName){
        audioList[i].pause();
    }
}

您的播放按钮将是这样的

<button id="play<?= $i ?>" class="btn-icon-play" onclick="var audioList = document.getElementsByTagName('audio');for(var i = 0; i < audioList.length; i++){if(audioList[i].tagName){audioList[i].pause();}}document.getElementById('player<?= $i ?>').play()"></button>

我认为它可以满足您的特定需求。

但是将javascrit内联标记放在一起并不是一个好习惯。你必须有一个包含javascript代码的separete文件。