Как я могу определить, играет ли элемент HTML5 Audio с Javascript? - PullRequest
Новая
       31

Как я могу определить, играет ли элемент HTML5 Audio с Javascript?

8 голосов
/ 06 ноября 2011

У меня есть элемент audio на веб-странице, и я хочу убедиться, что пользователь по-прежнему не воспроизводит его, когда покидает страницу. Как я могу быть уверен, что элемент audio не воспроизводится, когда страница выгружена? Пока у меня есть следующий код, но он не работает;диалоговое окно, которое появляется при выгрузке, сообщает, что playing равно false даже во время воспроизведения звука: 

<!DOCTYPE HTML><html>
<head>
    <script><!-- Loading Scripts -->
    function unloadTasks(){
        if (playing && !window.confirm("A podcast is playing, and navigating away from this page will stop that. Are you sure you want to go?"))
            window.alert("Here is where I will stop the page from unloading... somehow");
    }
    </script>
    <script><!-- Player Scripts -->
    var playing = false;
    function logPlay(){
        playing = isPlaying("e1audPlayer");
    }
    function isPlaying(player){
        return document.getElementById(player).currentTime > 0 && !document.getElementById(player).paused &&  !document.getElementById(player).ended;
    }
    </script>
</head>
<body onunload="unloadTasks()">
<audio id="e1audPlayer" style="width:100%;" controls="controls" preload="auto" onplaying="logPlay()" onpause="logPlay()">
    <source src="http://s.supuhstar.operaunite.com/s/content/pod/ADHD Episode 001.mp3" type="audio/mpeg"/>
    <source src="http://s.supuhstar.operaunite.com/s/content/pod/ADHD Episode 001.ogg" type="audio/ogg"/>
    Your browser does not support embedded audio players. Try <a href="http://opera.com/">Opera</a> or <a href="http://chrome.com/">Chrome</a>
</audio>
</body>
</html>

Рабочий пример

Ответы [ 2 ]

15 голосов
/ 21 ноября 2012 
function isPlaying(playerId) {
    var player = document.getElementById(playerId);
    return !player.paused && !player.ended && 0 < player.currentTime;
}
0 голосов
/ 06 ноября 2011

Я считаю, что браузер останавливает звук как часть процесса выгрузки страницы. Следовательно, к тому времени, когда вызывается ваша пользовательская функция выгрузки, звук останавливается.

Вы можете использовать onbeforeunload вместо onunload - это может сработать (не проверено).

Кроме того, вы можете установить флаг при запуске аудио и использовать событие onended, чтобы изменить этот флаг, когда аудио заканчивается, или когда пользователь вручную останавливает или приостанавливает его.

...