HTML5 аудио - воспроизведение звука несколько раз при щелчке, независимо от того, закончилась ли предыдущая итерация

Я создаю игру, в которой wav файл воспроизводится на клике - в этом случае это звуковой сигнал "удар".

Проблема в том, что если я быстро нажимаю, он не будет воспроизводить звук один раз для каждого клика - он, как если бы щелчки игнорировались во время воспроизведения звука, и как только звук будет закончен, он снова начнет прослушивать клики. Задержка, кажется, длится около одной секунды, поэтому вы считаете, что если кто-то нажимает 4 или 5 раз в секунду, мне нужно 5 чел, а не 1.

Здесь мой HTML:

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

Здесь мой JS:

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

Идеи?

Ответы

Ответ 1

После предварительной загрузки gun_bang.wav вы можете динамически создавать новые элементы с прикрепленным к нему звуком, воспроизводить аудио, а затем удалять их, когда звук закончен.

    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();
    });

Ответ 2

Я знаю, что это очень поздний ответ, я просто хотел, но, найдя решение, я обнаружил, что в моем случае лучше всего было предварительно загрузить звук, а затем клонировать node каждый раз, когда я хочу его воспроизвести, это позволяет мне воспроизводить его, даже если предыдущий не закончился:

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

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

Ответ 3

Вы можете обернуть следующее с помощью собственной логики щелчка по конкретному программному обеспечению, но следующее демонстрирует одновременно 3 звука пушки. Если вы хотите какую-либо задержку, вы можете ввести функцию minor sleep() (для этого легко найти много халатов для этого), или вы можете использовать setTimeout() для вызова последующих.

<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>