HTML5 Audio - Звук воспроизводится только один раз - PullRequest
Новая
       5

HTML5 Audio - Звук воспроизводится только один раз

12 голосов
/ 18 февраля 2012

Я использую Chrome, и это мой код: 

<audio id="letter_audio" src="audio/bomb.mp3" type="audio/mp3" preload="auto"></audio>

    $('.sound').live('click', function () {

        var sound = $("#letter_audio")[0];  

        sound.pause();
        sound.currentTime = 0;
        sound.play();

        return false;
    });

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

Ответы [ 4 ]

25 голосов
/ 23 марта 2012

У меня были похожие проблемы с воспроизведением аудио, но мне удалось решить эту проблему, вызвав метод load() перед вызовом play().Попробуйте это: 

$('.sound').live('click', function () {
    var sound = $("#letter_audio")[0];

    sound.load();
    sound.play();

    return false;
});

Я думаю, что это лучше, чем сброс атрибута src по двум причинам:

  1. Сохраняет значение src в содержимом страницы, а нев JavaScript

  2. Работает, когда вы вставляете несколько <source> элементов различных аудиоформатов: 

    <audio id="letter_audio">
   <source src="audio/bomb.mp3" type="audio/mp3" preload="auto"/>
   <source src="audio/bomb.ogg" type="audio/ogg" preload="auto"/>
</audio>
3 голосов
/ 18 февраля 2012

попробуйте это .. в основном, сброс атрибута src должен сбросить звук по желанию.

0 голосов
/ 04 марта 2013

вы можете использовать php, чтобы добавить запрос в конце URL со временем ();

<source src="URLtoTrack.mp3?<?php echo time(); ?>" />

работает для меня.

0 голосов
/ 13 февраля 2013

похоже, что в настоящее время атрибут currentTime доступен только для чтения (а в 2011 году он получил состояние wont-fix )

, однако, после установки src вВаш аудиообъект (опять же) - как и предложено @Lloyd - атрибут currentTime становится устанавливаемым (по крайней мере, в текущей chrome-версии для linux (24.0.1312.69)).

это означает добавлениестранная строка 

audio.src = audio.src

ваш пример делает то, что должен.

в полном объеме: 

$('.sound').live('click', function () {

    var sound = $("#letter_audio")[0];  
    sound.src = sound.src;  
    sound.pause();
    sound.currentTime = 0;
    sound.play();

    return false;
});

, поскольку достаточно установить src один раз, выВозможно, вы захотите позвонить куда-нибудь во время процесса установки.

...