Come riprodurre un mp3 usando Javascript?

Ho una directory sul mio sito web con diversi mp3. Io dinamicamente ne creo un elenco nel sito web usando php.Come riprodurre un mp3 usando Javascript?

Ho anche una funzione di trascinamento della selezione associata a loro e posso selezionare un elenco di quelli mp3 da riprodurre.

Ora, dando questa lista, come posso fare clic su un pulsante (Riproduci) e fare in modo che il sito Web riproduca il primo mp3 della lista? (So anche dove si trova la musica sul sito web)

fonte

2012-07-04 aF.

nei browser moderni, è possibile utilizzare [di HTML5 '

Se volete una versione che funziona per browser vecchio, ho fatto questa libreria:

function Sound(source,volume,loop) 
{ 
    this.source=source; 
    this.volume=volume; 
    this.loop=loop; 
    var son; 
    this.son=son; 
    this.finish=false; 
    this.stop=function() 
    { 
     document.body.removeChild(this.son); 
    } 
    this.start=function() 
    { 
     if(this.finish)return false; 
     this.son=document.createElement("embed"); 
     this.son.setAttribute("src",this.source); 
     this.son.setAttribute("hidden","true"); 
     this.son.setAttribute("volume",this.volume); 
     this.son.setAttribute("autostart","true"); 
     this.son.setAttribute("loop",this.loop); 
     document.body.appendChild(this.son); 
    } 
    this.remove=function() 
    { 
     document.body.removeChild(this.son); 
     this.finish=true; 
    } 
    this.init=function(volume,loop) 
    { 
     this.finish=false; 
     this.volume=volume; 
     this.loop=loop; 
    } 
}

Documentazione:

Sound prende tre argomenti. L'url del suono, il volume (da 0 a 100) e il loop (true to loop, false not to loop).
stop consentire a start dopo (contrariamente a remove).
init reimpostare l'argomento volume e loop.

Esempio:

var foo=new Sound("url",100,true); 
foo.start(); 
foo.stop(); 
foo.start(); 
foo.init(100,false); 
foo.remove(); 
//Here you you cannot start foo any more

fonte

2012-07-04 14:39:28 Mageek

è possibile sapere quando una musica finisce? –

Hai la lunghezza della musica? – Mageek

supporto per i browser per audio semplice: http://caniuse.com/#search=audio –

È possibile utilizzare il tag HTML5 <audio> per riprodurre audio utilizzando JavaScript.

Ma questa non è una soluzione cross-browser. È supportato solo nei browser moderni. Per la compatibilità tra browser devi probabilmente utilizzare Flash per questo (ad esempio jPlayer).

La tabella di compatibilità dei browser è fornita al collegamento I menzionato sopra.

fonte

2012-07-04 14:23:08 antyrat

Puoi fornire un esempio flash? –

@aF. puoi vedere un sacco di demo qui: http://jplayer.org/latest/demos/. jPlayer è opensource e rilasciato sotto licenze GPL e MIT. – antyrat

Prova questa generatore lettore audio scritto:

http://www.scriptgenerator.net/44/Audio-player-script-generator/

fonte

2012-07-04 14:27:23

probabilmente si desidera utilizzare il nuovo elemento HTML5 audio per creare un oggetto Audio, caricare il mp3, e riprodurlo.

A causa di incoerenze del browser, questo codice di esempio è un po 'lungo, ma dovrebbe soddisfare le vostre esigenze con un po' di tweaking.

//Create the audio tag 
var soundFile = document.createElement("audio"); 
soundFile.preload = "auto"; 

//Load the sound file (using a source element for expandability) 
var src = document.createElement("source"); 
src.src = fileName + ".mp3"; 
soundFile.appendChild(src); 

//Load the audio tag 
//It auto plays as a fallback 
soundFile.load(); 
soundFile.volume = 0.000000; 
soundFile.play(); 

//Plays the sound 
function play() { 
    //Set the current time for the audio file to the beginning 
    soundFile.currentTime = 0.01; 
    soundFile.volume = volume; 

    //Due to a bug in Firefox, the audio needs to be played after a delay 
    setTimeout(function(){soundFile.play();},1); 
}

Edit:

per aggiungere il supporto Flash, si potrebbe aggiungere un elemento object all'interno del tag audio.

fonte

2012-07-04 14:28:12

So che questa risposta ha 4 anni. Ma della lista di loro qui, questo è il migliore. L'ho ottimizzato un po 'per servire ai miei scopi. Ma funziona su tutto. Anche IE. E questo sta davvero dicendo qualcosa. – durbnpoisn

Si potrebbe provare SoundManager 2: gestirà in modo trasparente il tag <audio> ovunque sia supportato e utilizzerà Flash ovunque non sia.

fonte

2012-07-04 14:28:13

Supponendo che il browser supporti la riproduzione MP3 ed è abbastanza nuovo per supportare le nuove funzionalità JavaScript, suggerirei di dare un'occhiata a jPlayer. È possibile visualizzare una breve demo tutorial su come implementarla.

fonte

2012-07-04 14:28:28

new Audio('<url>').play()

fonte

2012-07-04 14:37:06 Ties

Documentazione completa: https://developer.mozilla.org/en-US/docs/Web/API/HTMLAudioElement – aymericbeaumet

goderne;)

<html> 
<head> 
    <title>Play my music....</title> 
</head> 
<body> 
    <ul> 
     <li> 
     <a id="PlayLink" href="http://www.moderntalking.ru/real/music/Modern_Talking-You_Can_Win(DEMO).mp3" onclick="pplayMusic(this, 'music_select');">U Can Win</a> 
     </li> 
     <li> 
     <a id="A1" href="http://www.moderntalking.ru/real/music/Modern_Talking-Brother_Louie(DEMO).mp3" onclick="pplayMusic(this, 'music_select');">Brother Louie</a> 
     </li> 
    </ul> 
<script type="text/javascript" src="http://mediaplayer.yahoo.com/js"></script> 
</body> 
</html>

fonte

2012-07-04 15:50:52 RAM

plugin jQuery per lettore audio mp3 http://www.jplayer.org/0.2.1/demos/

fonte

2012-07-05 10:59:11 Parag

Come riprodurre un mp3 usando Javascript?

risposta

Problemi correlati