2015-11-17 9 views
5

Muszę załadować dźwięk całkowicie przed jego odtworzeniem. Odtwarzacz powinien odtwarzać dźwięk automatycznie po jego całkowitym załadowaniu. Nie powinien być przycisk pauzy/użytkownik nie może go wstrzymać. Oto mój kod, ale nie mogę tego zrobić.Jak załadować dźwięk całkowicie przed rozpoczęciem odtwarzania?

Hyper Text Markup Language:

<audio class="audio-player" onloadeddata="myOnLoadedData()" onprogress="myOnProgress()" src="<?php echo $audio_link;?>" controls> 

JavaScript:

function myOnLoadedData() { 
    console.log('Loaded data'); 
    $('audio.audio-player').attr('autoplay','autoplay'); 
} 
function myOnProgress(){ 
    console.log('downloading'); 
} 

czy jest jakiś inny gracz, który spełnia moje wymagania?

+0

Czy próbowałeś użyć zdarzenia 'onload'? Nigdy nie użyłem dźwięku w "HTML5", ale użyję go i stworzyłem funkcję ładowania tablicy z muzyką do gier, której dotąd nie testowałem. – Hydro

+0

Wypróbuj 'onloadeddata()' – Alex

+0

już wypróbował onloadeddata onloadedmetadata. Najpierw musi załadować kompletny dźwięk i automatycznie go odtworzyć –

Odpowiedz

1

Spróbuj użyć XMLHttpRequest wrócić Blob pliku audio new Audio(), .load(), .play()

var request = new XMLHttpRequest(); 
request.open("GET", "/path/to/audio/file/", true); 
request.responseType = "blob";  
request.onload = function() { 
    if (this.status == 200) { 
    var audio = new Audio(URL.createObjectURL(this.response)); 
    audio.load(); 
    audio.play(); 
    } 
} 
request.send(); 
+0

jsfiddle http://jsfiddle.net/Lg5L4qso/ – guest271314

+0

To jest świetny sposób. Możesz także użyć statusu '500' powyżej, aby wykryć, czy odpowiedź przekroczyła limit czasu lub jeśli wystąpił błąd. 'this.status> = 500'. – Hydro

0

użyłem metody @ guest271314 zrobić funtion że załadować każdy link muzyka/URL, które znajdują się w obiekcie.

function LoadSounds(obj,ch,ca){ 
(function(r){ 
    var i, 
    lo=0, // number of sounds loaded 
    len=0, // number of sounds to load 
    con={}; // an object with the sounds loaded 
    for(i in obj){ 
     len++ // increase the number of sounds to load 
    } 
    for(i in obj){ 
     (function(i){ 
      r=0; 
      r=new XMLHttpRequest(); 
      r.open("GET",obj[i],true); 
      r.responseType="blob"; 
      r.onload=function(){ 
       if(this.status==200){ 
        lo++ 
        con[i]=new Audio(URL.createObjectURL(this.response)); 
        con[i].load(); 
        ch(obj[i]); 
        if(lo==len)ca(con) 
        r=undefined; 
       } 
      } 
      r.send(); 
     })(i); 
    } 
    i=undefined; 
})(0); 

}

sprężonego ...!

function LoadSounds(n,o,e){!function(t){var i,s=0,d=0,u={};for(i in n)d++;for(i in n)!function(i){t=0,t=new XMLHttpRequest,t.open("GET",n[i],!0),t.responseType="blob",t.onload=function(){200==this.status&&(s++,u[i]=new Audio(URL.createObjectURL(this.response)),u[i].load(),o(n[i]),s==d&&e(u),t=void 0)},t.send()}(i);i=void 0}(0)} 

Przykład użycia ...!

// Note that these musics in my example aren't in a valid link 
var MyMusics={ 
    Music1:'http://example.com/music.ogg', 
    BestEver:'http://example.com/bestever.ogg' 
}; 
LOAD_SOUNDS(
MyMusics, // Musics object 
function(){alert("+1 loaded");}, // function when a link music is loaded 
function(){e.BestEver.play();} // function when all musics from links were loaded 
); 
Powiązane problemy