如何判断HTML5音频元素是否正在使用Javascript播放 [英] How can I tell if an HTML5 Audio element is playing with Javascript

查看:187
本文介绍了如何判断HTML5音频元素是否正在使用Javascript播放的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在网页中有一个audio元素,并且我想确保用户离开该页面时仍不在播放它. 如何确定在卸载页面时未播放audio元素?到目前为止,我有以下代码,但似乎不起作用;卸载时弹出的对话框报告playingfalse,即使正在播放音频:

I have an audio element in a webpage, and I want to ensure that a user is not still playing it when they leave the page. How can I be sure the audio element is not playing when the page is unloaded? So far, I have the following code, but it doesn't seem to work; the dialog that pops up upon unload reports that playing is false even when the audio is playing:

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

工作示例

推荐答案

function isPlaying(playerId) {
    var player = document.getElementById(playerId);
    return !player.paused && !player.ended && 0 < player.currentTime;
}

这篇关于如何判断HTML5音频元素是否正在使用Javascript播放的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆