Я сделал плеер, который воспроизводит аудио файлы. Я хочу, чтобы игрок проиграл песню после того, как она закончилась. Ищу помощь в решении этой проблемы.

0

Это та часть, которая делает ссылку на первую песню.

    <html>
    <a href="pelay.html"> Play Song </a>
    </html>

Здесь происходит ссылка и автоматически воспроизводит звук после нажатия ссылки.

    <html>
    <body>
    <meta http-equiv="refresh" content="0; url=file:///C:/Users/Mau%20Mao/Music/music/Change.mp3" />
    </body>
    </html>

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

  • 0
    Вы вряд ли можете назвать это «аудиоплеером» вообще ИМХО. Посмотрите на audio элемент HTML5.
  • 0
    Вы просто перенаправляете браузер, чтобы он указывал на файл, и встроенный аудиоплеер воспроизводит его. Лучший способ сделать это - использовать audio HTML5, который, по моему мнению, имеет обратный вызов Javascript по окончании песни.
Показать ещё 3 комментария
Теги:
music-player

1 ответ

1

Поскольку меня попросили объяснить скрипку [ОБНОВЛЕНО], я опубликовал в комментариях:


<audio id="player" controls="true" autoplay="true"></audio>

Это элемент аудиоплеера. Это та часть, которая фактически воспроизводит аудио. Он отображается браузером, поэтому может выглядеть по-разному в зависимости от браузера и/или ОС. В Chrome это выглядит так: Изображение 174551
Поскольку я добавил атрибут controls вы можете его увидеть. Если вы должны удалить атрибут управления, вы сможете услышать звук, но не сможете его контролировать. autoplay сообщает браузеру, чтобы начать воспроизведение аудио, как только он загрузится.

var songs = ['song1.mp3', 'song2.mp3', 'song3.mp3'];

Это определяет новый массив, называемый песнями, который содержит URL-адреса трех песен. Больше можно добавить просто добавив , 'song4.mp3' к последнему значению.

var index = 0;

Это определяет новую переменную, которая будет содержать номер песни, в которой мы находимся. Это означает, что когда число равно 0, оно будет воспроизводить первую запись, 1 для второго и т.д. (Массивы начинаются с 0).

function nextSong(){
    alert('Triggered');
    $('#player').attr('src', songs[index++]);
}

Это создало новую функцию nextSong, которая при запуске изменит URL-адрес аудиоплеера на следующую песню в массиве. Как именно он выбирает игрока из идентификатора и устанавливает атрибут (attr) src (source) в запись в массиве песен с использованием номера индекса, а затем увеличивает индекс на единицу, чтобы в следующий раз он отобразил следующий песня в списке.

$("#player").bind('ended', nextSong);

Здесь он "связывает" ended событие на аудиоплеере с следующей функцией песни. Это означает, что когда он заканчивает игру (конец песни), тогда она запускает функцию nextSong которая меняет источник следующей песни и запускает ее снова.

$(document).ready(function(){
    nextSong();
});

Все это происходит, когда загружается страница, она запускает функцию nextSong один раз, чтобы вручную запустить ее, но, вероятно, не требуется из-за атрибута autoplay на аудиоплеере.


Я знаю, что есть, вероятно, более эффективные способы сделать это, но я попытался максимально упростить его, чтобы ассер понял код.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню