Воспроизведение тех audio которые выбраны через input checkbox

Question

Есть большое количество audio и checkbox-ы возле них. Если checkbox выбран, то audio должно воспроизводится, если не выбран, то audio на паузе. Допускается одновременное воспроизведение нескольких audio.

Нашел вот такой скрипт, но он был заточен под выбор одного audio по id. Я решил поправить - прописал getElementsByClassName, но не тут то было :)

Можете помочь поправить скрипт? Можно на js, можно на jquery, верстку тоже можно менять.

var shum = document.getElementsByClassName("shum");
var isPlaying = false;
function toggleShum() {
 isPlaying ? shum.pause() : shum.play();
};
shum.onplaying = function() {
 isPlaying = true;
};
shum.onpause = function() {
 isPlaying = false;
};

<input type="checkbox" class="btn-check" id="ogon" onClick="toggleShum()">
<audio controls loop class="shum" src="ogon.mp3"></audio>

<input type="checkbox" class="btn-check" id="kot" onClick="toggleShum()">
<audio controls loop class="shum" src="kot.mp3"></audio>

Answer 1

function toggleShum(box) {
  let player = box.nextElementSibling;
  if (box.checked) player.play();
  else player.pause();
}

<input type="checkbox" class="btn-check" id="ogon" onClick="toggleShum(ogon)">
<audio controls loop class="shum" src="ogon.mp3"></audio>

<input type="checkbox" class="btn-check" id="kot" onClick="toggleShum(kot)">
<audio controls loop class="shum" src="kot.mp3"></audio>

БЛОГ НА HUSL

Воспроизведение тех audio которые выбраны через input checkbox

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