Начать проигрывание нового и остановить воспроизведение уже запущенного трека по нажатию на ссылку

Question

Есть список из ссылок, по нажатию на которые должна проигрываться музыка.

<div class="dropdown-content">
  <a onclick="playAudio(0);">Без фонового звука</a>
  <a onclick="playAudio(1);">Anjey Satori - Muladhara</a>
  <a onclick="playAudio(2);">Musical Mandalas - Solemn Grace</a>
  <a onclick="playAudio(3);">Great Meditation Guru - Internal Silence</a>
  <a onclick="playAudio(4);">Musical Mandalas - Take Me with You</a>
  <a onclick="playAudio(5);">Sergei Shell - Dawn of a New Awakening Crystal Ships of Time</a>
</div>

Сейчас звук проигрывается, но при нажатии на другую ссылку звук накладывается друг на друга

function playAudio(s){

let myAudio = new Audio;
if (s == 1 ){
    myAudio.src = "music/muladhara.mp3" ;
} else if (s == 2){
    myAudio.src = "music/solemnGrace.mp3";
} else if (s == 3){
    myAudio.src = "music/internalSilence.mp3";
} else if (s == 4){
    myAudio.src = "music/takeMeWithYou.mp3";
} else if (s == 5){
    myAudio.src = "music/dawn.mp3";
} else {
    alert('Фоновая музыка проигрываться не будет')
}
myAudio.play();
}

Возможно ли выключать первый звук при нажатии на другой?

Answer 1

let myAudio;
function playAudio(s){
  if (myAudio)
    myAudio.pause();

  myAudio = new Audio();
  if (s == 1){
    ...

let myAudio;

function playAudio(s) {
  if (myAudio)
    myAudio.pause();
    
  myAudio = new Audio();
  if (s == 1) {
    myAudio.src = "https://www.kozco.com/tech/LRMonoPhase4.wav";
  } else if (s == 2) {
    myAudio.src = "https://www.kozco.com/tech/piano2.wav";
  } else if (s == 3) {
    myAudio.src = "https://www.kozco.com/tech/organfinale.wav";
  } else {
    console.log('Фоновая музыка проигрываться не будет')
  }
  myAudio.play();
}

<div class="dropdown-content">
  <a onclick="playAudio(1);">AAA</a>
  <a onclick="playAudio(2);">BBB</a>
  <a onclick="playAudio(3);">CCC</a>
</div>

БЛОГ НА HUSL

Начать проигрывание нового и остановить воспроизведение уже запущенного трека по нажатию на ссылку

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