Audio HTML5: reproduzca el sonido repetidamente al hacer clic, independientemente de si la iteración anterior ha finalizado

Question

Estoy construyendo un juego en el que se reproduce un archivo wav al hacer clic, en este caso es un sonido de pistola "explosión".

El problema es que si hago clic rápido, no reproducirá el sonido una vez por cada clic: es como si los clics se ignoran mientras se reproduce el sonido, y una vez que el sonido finaliza, comienza a escuchar clics otra vez . El retraso parece ser alrededor de un segundo de duración, por lo que imagino que si alguien hace clic 4 o 5 veces por segundo, quiero 5 explosiones, no a 1.

Aquí está mi HTML:

<audio id="gun_sound" preload> 
    <source src="http://www.seancannon.com/_test/audio/gun_bang.wav" /> 
</audio> 

Aquí está mi JS:

$('#' + CANVAS_ID).bind(_click, function() { 
    document.getElementById('gun_sound').play(); 
    adj_game_data(GAME_DATA_AMMO_ID, -1); 
    check_ammo(); 
}); 

Ideas?

Answer 1

Una vez que el gun_bang.wav está precargado, puede hacer dinámicamente nuevos elementos con ese sonido conectado, reproducir el audio y luego eliminarlos cuando el audio haya finalizado.

function gun_bang(){ 
     var audio = document.createElement("audio"); 
     audio.src = "http://www.seancannon.com/_test/audio/gun_bang.wav"; 
     audio.addEventListener("ended", function() { 
      document.removeChild(this); 
     }, false); 
     audio.play(); 
    } 

    $('#' + CANVAS_ID).bind(_click, function() { 
     gun_bang(); 
     adj_game_data(GAME_DATA_AMMO_ID, -1); 
     check_ammo(); 
    }); 

Answer 2

Sé que es una respuesta muy tarde, sólo quería, pero en busca de una solución que encontré que en mi caso, el mejor fue para precargar el sonido y luego clonar el nodo cada vez que quiero jugar , esto me permite jugar incluso si el anterior no ha terminado:

var sound = new Audio("click.mp3"); 
sound.preload = 'auto'; 
sound.load(); 

function playSound(volume) { 
    var click=sound.cloneNode(); 
    click.volume=volume; 
    click.play(); 
} 

Answer 3

puede envolver el siguiente con su propia lógica clic específica del programa, pero lo que sigue demuestra arma 3 sonidos al mismo tiempo. Si desea algún tipo de retraso, puede introducir una función de reposo menor() (se pueden encontrar fácilmente muchos hacks de kludge para esto), o puede usar setTimeout() para llamar a los subsiguientes.

<audio id="gun_sound" preload="preload"> 
    <source src="http://www.seancannon.com/_test/audio/gun_bang.wav" /> 
</audio> 

<script type="text/javascript"> 
jQuery(document).ready(function($){ 

    $('#gun_sound').clone()[0].play(); 
    $('#gun_sound').clone()[0].play(); 
    $('#gun_sound').clone()[0].play(); 

}); 
</script>