HTML5 오디오 다중 재생

Question

자바 스크립트 게임을 프로그래밍하고 여러 번 한 소리를 사용하고 싶습니다. 하나의 사운드를 배열에 더 많이로드하면됩니다. 하지만 하나의 사운드를 한 번로드하고 배열에 복사하려고하므로 여러 번 재생할 수 있습니다.

this.list = [ 
     "LaserShot", //http://www.freesound.org/samplesViewSingle.php?id=39459 
     "Ding", //http://www.freesound.org/samplesViewSingle.php?id=5212 
     "Rocket" //http://www.freesound.org/samplesViewSingle.php?id=47252 -> http://creativecommons.org/licenses/sampling+/1.0/ 
    ]; 

... 

for (i in this.list) { 
     this.sounds[this.list[i]] = new Array(); 

     for (var j = 0; j < this.channels; j++) { 
      this.sounds[this.list[i]][j] = new Audio("./sounds/"+ this.list[i] + type); 
     } 
    } 

난 그냥이 작업을 수행 할 수 :

for (i in this.list) { 
     this.sounds[this.list[i]] = new Array(); 

var tempAudio = new Audio("./sounds/"+ this.list[i] + type); 

     for (var j = 0; j < this.channels; j++) { 
      this.sounds[this.list[i]][j] = realCopyOfTempAudio; 
     } 
    } 

는 정말 감사 이것은 내가 지금 무슨 방법이다.

Answer 1

내 경험 :

는 같은 소스로 더 많은 오디오 html 태그를 작성하는 것이 좋습니다. 나는 js의 팬이지만 html 형식의 html 오디오 태그를 사용하는 것이 더 좋습니다.

나는 중복 오디오 태그를 만들었고 나의 필요를 장식했다. 동일한 사운드를 1 초에 여러 번 재생하려면 더 많은 복제본을 추가하십시오.

또한 자동 재생 버그를 해결할 수 있습니다 (당신이 재정의 클릭 이벤트, 지금은 중요하지 사용할 수 있습니다 대신 EXE_JUST_ONE_TIME의) :

<audio controls id="LaserShot" > 
<source src="LaserShot.mp3" type="audio/mpeg"> 
<source src="LaserShot.ogg" type="audio/ogg"> 
</audio> 
<audio controls id="LaserShot_CLONE" > 
<source src="LaserShot.mp3" type="audio/mpeg"> 
<source src="LaserShot.ogg" type="audio/ogg"> 
</audio> 

var에 EXE_JUST_ONE_TIME을 = 거짓;

document.addEventListener (함수 (전자) {

if (EXE_JUST_ONE_TIME == false){ 
EXE_JUST_ONE_TIME = true; 

document.getElementById("LaserShot").play(); 
document.getElementById("LaserShot").pause(); 
// now you can play programmability from js 
document.getElementById("LaserShot_CLONE").play(); 
document.getElementById("LaserShot_CLONE").pause(); 

} 

}를 "클릭"

마지막 부분 (이 핸들러는 하나 개의 복제 작동) 처리해야 :

var play_SHOT = function(){ 

if (document.getElementById('LaserShot').duration > 0 && !document.getElementById('LaserShot').paused) { 

document.getElementById('LaserShot_CLONE').play(); 

} 
else { 

document.getElementById('LaserShot').play(); 

} 

}