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

Question

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

0

Мы пытаемся создать аудиоплеер html5, в котором у нас есть более одного .mp3 file который мы показываем в табличной форме, используя loop with php и мы действительно хотим этого: когда мы нажимаем на каждый mp3 file тогда он должен воспроизводиться только один интерфейс, как и http://gaana.com.

Что мы сделали:

<?php
if(isset($_GET['song'])) {
    $song_name = $_GET['song'];
    echo "<audio id=\"audio1\" src=\"$song_name.mp3\" controls preload=\"none\" type=\"audio/mp3\" autobuffer autoplay></audio>";   
}

?>

<script>
function EvalSound(soundobj) {
  var thissound=document.getElementById(soundobj);
  thissound.play();
}
function EvalSound1(soundobj1) {
  var thissound=document.getElementById(soundobj1);
  thissound.pause();
}
</script>

в приведенном выше коде мы получаем .mp3 file используя метод get и мы передаем имя mp3 file в URL-адресе.

Mouser 21 фев. 2015, в 15:33

Источник

Теги:

php

javascript

audio

html5

1 ответ

Ещё вопросы

Mouser · Answer 1 · 2015-02-21T11-36-00.000Z

ДЕМОНСТРАЦИОННЫЙ КОД:

var tracks = ['https://archive.org/download/testmp3testfile/mpthreetest.mp3', 'http://www.tonycuffe.com/mp3/tail%20toddle.mp3'];

Array.prototype.map.call(document.querySelectorAll("button"), function(element, index){
    element.addEventListener("click", changeTrack.bind(null, tracks[index]), false);  
});

var autoPlay = true;
function changeTrack(track)
{
   var audioElement = document.getElementById("audio1");
   audioElement.src = track;
}
audioElement.addEventListener("canplay", startPlaying, false);

function startPlaying()
{
    if (autoPlay)
    {
        this.play();
    }
}

<button>Track 1</button>
<button>Track 2</button>

<audio id="audio1" src="song_name.mp3" controls preload="none" type="audio/mp3" autobuffer autoplay></audio>";

CORE CODE (фактическое решение)

var autoPlay = true;
function changeTrack(track)
{
   var audioElement = document.getElementById("audio1");
   audioElement.src = track;
}
audioElement.addEventListener("canplay", startPlaying, false);

function startPlaying()
{
    if (autoPlay)
    {
        this.play();
    }
}

Когда кто-то нажимает на другую звуковую ссылку, он должен вызывать функцию changeTrack() с аргументом, ссылающимся на URL-адрес трека. Если трек загружен, он начнет воспроизведение.

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