Как воспроизводить один трек за другим с тегом <audio>в HTML5, используя JS / jQuery? - PullRequest
1 голос
/ 16 декабря 2011

В попытке преодолеть ограничение на количество символов в Google TTS API в 100 символов, попытался зациклить каждые 100 символов, чтобы получить свежий mp3 из API и играть без проблем. Пробовал несколько способов, но .play () и слушатели событий вроде canplay / onended не просто работают внутри цикла! Лучшее, чего можно достичь, это заставить все загруженные треки воспроизводиться одновременно, а не один за другим. Ниже приведен код: -

if ($("#theinput").attr("value").length > 100){
var len = $("#theinput").attr("value").length;
alert(len);
var audioPlayer = document.getElementById("spokenmemory");    
for (var i=0; i < (len / 100); i++) {
var stl=i*100;
var str = $("#theinput").attr("value").substr(stl, 100);
$("#spokenmemory").attr("src", "http://translate.google.com/translate_tts? tl=en&q="+str);
alert(str);
audioPlayer.load();  
audioPlayer.addEventListener('canplay', function () {
              alert('Loaded');
              audioPlayer.play();
            } );
//audioPlayer.play(); 

            }

Любая помощь будет оценена.

1 Ответ

0 голосов
/ 24 декабря 2011

Попробуйте вместо этого использовать функцию триггера

fadeInAudio : function(audio){
//      audio.play();
    audio.trigger("play");
},

fadeOutAudio : function(audio){
//      audio.pause();
    audio.trigger("pause");
},
...