Веб: Как играть аудиофайлы один за другим без задержки?

У меня есть URLs нескольких звуковых файлов, как это:Веб: Как играть аудиофайлы один за другим без задержки?

example.net/{num}.mp3

И я хотел бы играть их один за другим без задержки между ними.

Я пробовал иметь два аудиоэлемента с preload=true и переключаться между ними, но у меня все еще есть задержка.

Любые идеи?

2016-06-28 HasanAboShally

Я уверен, что вы уже об этом подумали, но подтвердили ли вы, что в звуковые дорожки нет тишины? –

Вы можете использовать ended событие, Array.prototype.shift() установить src элемента к следующему элементу в массиве, если массив .length больше 0, вызовите .load(), .play()

var url = "example.net/" 
var type = ".mp3"; 
var n = [0,1,2,3,4,5]; 
var audio = document.querySelector("audio"); 
audio.onended = function() { 
if (n.length) { 
    this.src = url + n.shift() + type; 
    this.load(); 
    this.play(); 
} 
} 
audio.src = url + n[0] + type; 
audio.load(); 
audio.play();

источник

2016-06-28 02:14:02 guest271314

<html> 
<head> 
    <title>Subway Maps</title> 

    <link rel="stylesheet" type="text/css" href="main.css" /> 
</head> 
<body onload="onload();"> 
    <video id="idle_video" width="1280" height="720" onended="onVideoEnded();"></video> 
    <script> 
     var video_list  = ["Skydiving Video - Hotel Room Reservation while in FreeFall - Hotels.com.mp4", 
           "Experience Conrad Hotels & Resorts.mp4", 
           "Mount Airy Casino Resort- Summer TV Ad 2.mp4" 
          ]; 
     var video_index  = 0; 
     var video_player = null; 

     function onload(){ 
      console.log("body loaded"); 
      video_player  = document.getElementById("idle_video"); 
      video_player.setAttribute("src", video_list[video_index]); 
      video_player.play(); 
     } 

     function onVideoEnded(){ 
      console.log("video ended"); 
      if(video_index < video_list.length - 1){ 
       video_index++; 
      } 
      else{ 
       video_index = 0; 
      } 
      video_player.setAttribute("src", video_list[video_index]); 
      video_player.play(); 
     } 
    </script> 
</body>

для refrence how to display multiple videos one by one dynamically in loop using HTML5 and javascript

источник

2016-06-28 02:16:21

Я бы хотел увидеть фактический код того, что у вас есть, потому что я не уверен на 100%, что «переключение между ними» но я написал следующий пример, который запускает следующий файл, играющий до окончания первого. Необходимо указать определенное количество «перекрытия», и он начинает играть следующий файл JSFiddle: http://jsfiddle.net/76xqhupw/4/

const OVERLAP_TIME = 1.0; //seconds 

const song1 = document.getElementById('audio1'); 
const song2 = document.getElementById('audio2'); 

song1.addEventListener("timeupdate", function() { 
    if (song1.duration - song1.currentTime <= OVERLAP_TIME) { 
    song2.play(); 
    } 
}); 

song1.play();

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

источник

2016-06-28 02:48:32

Веб: Как играть аудиофайлы один за другим без задержки?

ответ

Смежные вопросы