У меня есть несколько тегов HTML 5 ‹Audio› на одной странице, и я хочу, чтобы ВСЕ они приостанавливались при воспроизведении другого

Я думаю, мне нужен сценарий, который «получит» все элементы управления воспроизведением звука HTML5 и «приостановит» их, кроме того, на котором пользователь нажимает кнопку воспроизведения. Я видел и могу справиться с простым воспроизведением, паузой, остановкой с помощью всего одного элемента управления звуком, но мои навыки не позволяют мне кодировать что-то, чтобы делать то, что мне нужно, с несколькими. управление звуком — отличное решение, которое хорошо интегрируется с моим текущим дизайном, мне просто нужна помощь, чтобы оно работало правильно. Вариант использования:

Страница https://aberaeronskies.com/ загружается, но ничего не воспроизводится, пользователь нажимает кнопку воспроизведения на теге управления звуком и воспроизводится нужный фрагмент трека. Пользователь нажимает на другой (их 14), и он начинает играть, проблема в том, что первый все еще играет, что нежелательно; можно было щелкнуть по всем из них, и все они заиграли бы!

Требование к сценарию или звонку или чему-то еще (я не кодер, просто делаю это как халяву для товарища), что, когда пользователь нажимает кнопку воспроизведения на любой из 14 дорожек, он приостанавливает все остальные воспроизводимые дорожки.

Я думал, что это все: Приостановите всех других игроков, кроме активированного. Плагин jQuery audio для элемента ‹audio› и Воспроизведение выбранного звука во время паузы /reseting other, но я не могу заставить их работать.

Возможно, это невозможно сделать, и мне нужно переосмыслить всю презентацию нескольких треков, и если это так, дальнейшие советы о том, где искать (в дополнение к вышеизложенному), также будут полезны.

Большое спасибо...


html audio controls pause
person Andy Banks    schedule 16.02.2020    source источник
comment
Добро пожаловать в Stack Overflow. Помните, что этот форум предназначен для решения проблем, связанных с кодом, и требует минимального воспроизводимого примера. Нам нужно увидеть, какой код вы пробовали и где возникла проблема.   -  person wlh    schedule 16.02.2020

Ответы (1)


arrow_upward
0
arrow_downward

Ах... Это работает

var curPlaying;
window.addEventListener("play", function(evt)
{
if(window.$_currentlyPlaying && window.$_currentlyPlaying != evt.target)
{
    window.$_currentlyPlaying.pause();
} 
window.$_currentlyPlaying = evt.target;
}, true);
$(function () {
$(".playback").click(function (e) {
    e.preventDefault();
    var song = $(this).next('audio')[0];
    if (song.paused) {
        if (curPlaying) {
            $("audio", "#" + curPlaying)[0].pause();
        }
        song.play();
        curPlaying = $(this).parent()[0].id;
    } else {
        song.pause();
        curPlaying = null;
    }
});
});
person Andy Banks    schedule 16.02.2020
comment
Благодаря stackoverflow.com/users/5057453/amin-baig (stackoverflow.com/questions/52877828/) для возможного решения. - person Andy Banks; 17.02.2020