Кнопка JavaScript Stop All Audio на странице

Question

Я использую встроенный проигрыватель mixlr.com для воспроизведения аудио. Теперь мне нужна кнопка, чтобы остановить звук всего сайта. Хотя у игрока есть собственная кнопка паузы воспроизведения. Но мне нужна моя собственная кнопка для управления звуком всего сайта, где, если я нажму кнопку паузы, он приостановит звук всего вашего сайта. Может ли кто-нибудь помочь мне, пожалуйста?

Answer 1

Pause все аудио с помощью одной кнопки:

document.getElementById('stopButton').onclick = function() { 
 
    var sounds = document.getElementsByTagName('audio'); 
 
    for(i=0; i<sounds.length; i++) sounds[i].pause(); 
 
};

<audio src="http://www.noiseaddicts.com/samples_1w72b820/1456.mp3" autoplay loop> 
 
    Your browser does not support the <code>audio</code> element. 
 
</audio> 
 

 
<audio src="http://www.noiseaddicts.com/samples_1w72b820/3717.mp3" autoplay loop> 
 
    Your browser does not support the <code>audio</code> element. 
 
</audio> 
 

 
<audio src="http://www.noiseaddicts.com/samples_1w72b820/118.mp3" autoplay loop> 
 
    Your browser does not support the <code>audio</code> element. 
 
</audio> 
 

 
<input id="stopButton" type="button" value="Stop All Audio" />

Answer 2

<script type="text/javascript"> 
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); 

</script> 

Answer 3

Ниже кода может помочь кому-то достижение этой цели.

var audioMap = new Map(); 
var rappers = document.querySelectorAll('.rapper'); 
rappers.forEach(function(rapper){ 
    audioMap.set(rapper, new Audio()); 
    rapper.addEventListener('click', function(){ 
     var audio = new Audio($(this).data('audio')); 
     audio.play(); 
     audioMap.set(this, audio); 
     var current = audioMap.get(this); 
     // console.log('get', current); 
     audioMap.forEach(function(audio){ 
      if(audio != current){ 
       audio.pause(); 
       audio.currentTime = 0; 
      } 
     }); 
    }); 
});