HTML5 -如何在另一个音频标签开始播放时停止音频

HTML5 - how to stop audio when another audio tag starts playing?

本文关键字：音频 播放 开始 标签 HTML5 另一个      更新时间：2023-09-26

我有这个javascript函数:

var currentPlayer;
function EvalSound(soundobj) {
    var thissound = document.getElementById(soundobj);
    if (currentPlayer && currentPlayer != thissound) {
        currentPlayer.pause(); 
    }
    if (thissound.paused) {
        thissound.play();
    } else {
        thissound.pause();
    }
    thissound.currentTime = 0;
    currentPlayer = thissound;
}

这个html5音频播放器在Yii2的Gridview小部件内循环重复(它创建了许多播放器，每个播放器都有不同的歌曲):

'value'=> function ($data){                      
    return "<audio controls>
            <source src='" . $data->ficheiro . "' type='audio/mp3' />
            </audio>";
},

问题是，当我有一个音频标签播放，并点击另一个播放按钮，它不会停止以前播放音频标签，并开始新的。两个音频标签同时播放。我试图适应javascript函数，但它不工作。

我也尝试声明var thisound = $('audio');

它也不工作

我需要在音频标签中添加ID吗?我需要将onClick='EvalSound'事件关联到音频标签吗?

好的，我是这样解决的:

addEventListener捕获音频开始播放，for循环暂停所有其他音频标签。

document.addEventListener('play', function(e) {
    var audios = document.getElementsByTagName('audio');
    for (var i = 0, len = audios.length; i < len; i++) {
        if (audios[i] != e.target) {
            audios[i].pause();
        }
    }
}, true);

您没有唯一的方法来标识<audio>标记。使用通用的$("audio")选择器会使问题变得更糟。使用id的所有标签，并使其工作方式

相关文章：