Остановка звука при переключении на след. звук

Question

Есть скрипт, который при каждом клике переключает звук. Но при переходе на новый звук, предыдущий звук не выключается. Попробуйте нажать на кнопку 6-8 раз подряд и вы сами все поймете. Как сделать так, чтобы предыдущий звук вырубался при переключении на следующий звук.

let audio1 = new Audio('https://drive.google.com/u/0/uc?id=1wBlae0CBF5LQ5BlkPFkFfcZ4hcetYCQE&export=download');
let audio2 = new Audio('https://drive.google.com/u/0/uc?id=1qCJjhIGgJDSAushprQpPbE9rMNYr0YO9&export=download');
let audio3 = new Audio('https://drive.google.com/u/0/uc?id=1aeV_oyfFWnDY8vAJGleHCPLf0J6c_dRl&export=download');


let a = document.querySelector('.opa');
let storage = [audio1, audio2, audio3];
let count = 0;

a.addEventListener('click', function(){

if(count == storage.length){
count = 0;  
}   
  
storage[count].play();

count = count +1;
});

.opa{
margin-top: 50px;   
padding:10px;
margin-left:130px;
}


.main{
margin-top: 50px;   
width: 120px;
margin-left:100px;  
background: black;
padding: 30px;
}

.item{
margin-top:20px;
background:gray;
width:100%;
height:120px;   
border-radius: 200px;
}

<button class = 'opa'>БЫРО ИГРАЙ!</button>

<div class ="main">

<div class ="item"> 1</div>
<div class ="item"> 2</div>
<div class ="item"> 3</div>

</div>

Answer 1

let audio1 = new Audio('https://drive.google.com/u/0/uc?id=1wBlae0CBF5LQ5BlkPFkFfcZ4hcetYCQE&export=download');
let audio2 = new Audio('https://drive.google.com/u/0/uc?id=1qCJjhIGgJDSAushprQpPbE9rMNYr0YO9&export=download');
let audio3 = new Audio('https://drive.google.com/u/0/uc?id=1aeV_oyfFWnDY8vAJGleHCPLf0J6c_dRl&export=download');

let a = document.querySelector('.opa');
let storage = [audio1, audio2, audio3];
let count = -1;

a.addEventListener('click', function() {
  if (storage[count])
    storage[count].pause();
  count = count + 1;
  if (count == storage.length) {
    count = 0;
  }
  storage[count].play();
});

.opa {
  margin-top: 50px;
  padding: 10px;
  margin-left: 130px;
}

.main {
  margin-top: 50px;
  width: 120px;
  margin-left: 100px;
  background: black;
  padding: 30px;
}

.item {
  margin-top: 20px;
  background: gray;
  width: 100%;
  height: 120px;
  border-radius: 200px;
}

<button class='opa'>ИГРАЙ!</button>

<div class="main">

  <div class="item"> 1</div>
  <div class="item"> 2</div>
  <div class="item"> 3</div>

</div>

БЛОГ НА HUSL

Остановка звука при переключении на след. звук

Ответы (1 шт):