Последовательное воспроизведение аудиофайлов в HTML5

Как я могу использовать PHP для последовательного воспроизведения аудиофайлов?

У меня есть несколько аудиофайлов, которые я хотел бы воспроизводить последовательно, а не одновременно. Я использую код, подобный следующему:

<audio controls autoplay='true'>
  <source src="sample1.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>

<audio controls autoplay='true'>
  <source src="sample2.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>

Мне нужно, чтобы sample2 воспроизводился через 5 секунд после окончания воспроизведения sample1. В обоих случаях не должно быть никакого взаимодействия с пользователем.

Обновлять

Я думал, что это должно быть так же просто, как использование последовательных вызовов функций, но это не сработало. Я начал изучать и использовать функцию sleep(), используя приведенный ниже пример кода:

print "<br>Line1";
sleep(10);
print "<br>Line2";

Это просто задерживает весь скрипт на 10 секунд и печатает оба оператора, а не один за другим. То же самое и с аудиофайлами, и это, в конечном счете, проблема, которую я пытаюсь решить.


audio autoplay php-5.5
person sisko    schedule 07.10.2014    source источник

Ответы (3)


arrow_upward
3
arrow_downward

попробовав несколько скриптов, я нашел, это то, что сработало для меня

    var audionameslist = `
        audiolib/1.mp3,
        audiolib/2.mp3,
        audiolib/3.mp3
    `;
    var audionamesarray = audionameslist.split(',');
    var audio = new Audio(audionamesarray[0]);
        
    audio.src=audionamesarray[0];
    audio.play();
       
    index=1;
    audio.onended = function() {
        if(index < audionamesarray.length){
            audio.src=audionamesarray[index];
            audio.play();
            index++;
        }
    };
person user11896251    schedule 07.08.2019

arrow_upward
0
arrow_downward

На вопрос уже был дан ответ. Вам не нужен PHP, все это в API-интерфейсах HTML5.

У игрока закончилось событие ended. Просто измените атрибут src после срабатывания end. Затем элемент загрузит «следующую песню».

Посмотрите здесь

К вашему сведению: я просто скопировал ваш заголовок, поискал его в Google и вуаля! Я нашел этот ТАК вопрос...

person Borislav Sabev    schedule 07.10.2014

arrow_upward
-1
arrow_downward

Вы можете создать небольшой JS, как показано ниже. Просто передайте идентификатор аудиоэлемента в функцию, и она должна воспроизводить его последовательно. Спасибо и всего наилучшего.

function playAll(audioidlist) {
    var audioarray = audioidlist.split(',');
    for (var i = 0; i < audioarray.length; i++) {
        var audio = document.getElementById(audioarray[i]);
        audio.play();
        while (!audio.ended) {
        }
    }
}
person sgk    schedule 04.05.2018
comment
Ой! Используйте обратный вызов вместо бесконечного цикла! - person Tyler Hoppe; 09.03.2019