HTML5 Audio funktioniert nicht mit setTimeout-Methode

Question

Ich bin relativ neu zu JavaScript und jQuery, was ich tue eigentlich eine Funktion mit einem Array von einigen Farben, zunächst ist es ['blue', 'green'] Und ich läuft eine for-Schleife auf Dieses Array gibt den Sound für jede Nummer wieder.

Aber das Problem ist, es spielt nur Sound mit dem letzten Parameter. Warum? Ich möchte beide (oder wie viele ich einstellen) Sounds abspielen, die nach einem festen Intervall abgespielt werden (wie hier habe ich 1000ms). Danke im Voraus.

Hier ist mein Code:

function singPattern(compPattern) { 
    var audio; 
    for(let i=0; i<compPattern.length; i++) { 

     audio = new Audio("../../music-files/" + compPattern[i] + ".mp3"); 
     window.setTimeout(function() { 
      audio.play(); 
     }, 2000); 
    } 
} 

Answer 1

function singPattern(compPattern) { 
    var audio; // There is only one audio 
    for(let i=0; i<compPattern.length; i++) { 

     //everytime in this loop audio is assigned to the "Audio" 
     // the old one is off to the pasture. (dead)(GC) 
     audio = new Audio("../../music-files/" + compPattern[i] + ".mp3"); 
     window.setTimeout(function() { 
      audio.play(); 
     }, 2000); 
    } 
} 

Wie in allen Dingen Javascript, gibt es mehrere Möglichkeiten, dies zu umgehen.

Sie könnten das Objekt in das Timeout wie folgt übergeben. und die Auszeit wird eine Schließung des Objekts haben.

function singPattern(compPattern) { 
    for(let i=0; i<compPattern.length; i++) { 
     // I will just print the word but you can pass the object in. 
     var audio = compPattern[i] + ".mp3"; 
     window.setTimeout(function (_audio) { 
      console.log(_audio) 
     }, 2000, audio); 
    } 
} 

Wenn Sie Zugriff auf das Audio Objekt müssen außerhalb des setTimeout, um sie abzubrechen/Wiedergabe Sie ein Wörterbuch wie folgt gesetzt werden könnte:

function singPattern(compPattern) { 
    var audio ={}; 
    for(let i=0; i<compPattern.length; i++) {  
     audio[compPattern[i]] = compPattern[i] + ".mp3";   
    } 
    setTimeout(function(){ 
     for(var a in audio){ console.log("play ", a , audio[a]); } 
    },2000); 
    // audio['green'].pause() ?  
} 

bearbeiten

Heres eine Arbeits Probe mit externen mp3s

function singPattern(compPattern) { 
 
    for (let i = 0; i < compPattern.length; i++) { 
 
    var audio = compPattern[i];   
 
    setTimeout(function (_audio) { 
 
     var sound = new Audio(_audio); 
 
     console.log("Playing " + _audio); 
 
     sound.play(); 
 
    }, 2000, audio); 
 
    } 
 
} 
 

 
var soundUrls = ["http://soundbible.com/mp3/Stream Noise-SoundBible.com-866411702.mp3", "http://soundbible.com/mp3/Strange_Days-Mike_Koenig-176042049.mp3"]; 
 

 
singPattern(soundUrls);