Я пытаюсь сделать так, чтобы при нажатии на отдельный элемент он приостанавливал воспроизведение текущей песни из другого элемента. Кроме того, ранее я делал это так, чтобы при нажатии на тот же элемент после того, как он начал воспроизводить звук, звук приостанавливался, но при нажатии на другой элемент с той же функцией он прерывался.
var paused = true;
var song;
var songPlaying;
function playSong(x) {
song = x;
if(songPlaying != song){
document.getElementById(songPlaying).pause();
}
if(paused == true){
document.getElementById(song).play();
paused = false;
songPlaying = song;
} else {
document.getElementById(song).pause();
paused = true;
}
}
Можно ли как-нибудь это исправить? Придется ли мне делать разные функции для каждой песни?
РЕДАКТИРОВАТЬ 1: Здесь HTML my для разделов, которые я использую, каждый аудиофайл имеет идентификатор, который вызывается в качестве параметра в функция внутри onclick
РЕДАКТИРОВАТЬ 2: При попытке решения Laif'а я попытался добавить класс 'song' к моим HTML img элементам и связал его с моим аудиоэлементом с помощью класса 'song1' это все еще не работает. Я делаю уроки неправильно или это что-то не так, как я их записал?
<div class="album">
<img src="assets/BattalionsOfFear.png" class="song song1">
<h1>Battalions of Fear</h1>
<p>Released in 1988</p>
</div>
<audio id="bofSong" class="song1">
<source src="assets/BattalionsOfFear.mp3">
</audio>