HTML5 check if audio is playing?
JavascriptHtmlAudioJavascript Problem Overview
What's the javascript api for checking if an html5 audio element is currently playing?
Javascript Solutions
Solution 1 - Javascript
function isPlaying(audelem) { return !audelem.paused; }
The Audio tag has a paused
property. If it is not paused, then it's playing.
Solution 2 - Javascript
You can check the duration. It is playing if the duration is more than 0 seconds and it is not paused.
var myAudio = document.getElementById('myAudioID');
if (myAudio.duration > 0 && !myAudio.paused) {
//Its playing...do your job
} else {
//Not playing...maybe paused, stopped or never played.
}
Solution 3 - Javascript
While I am really late to this thread, I use this implementation to figure out if the sound is playing:
service.currentAudio = new Audio();
var isPlaying = function () {
return service.currentAudio
&& service.currentAudio.currentTime > 0
&& !service.currentAudio.paused
&& !service.currentAudio.ended
&& service.currentAudio.readyState > 2;
}
I think most of the flags on the audio element are obvious apart from the ready state which you can read about here: MDN HTMLMediaElement.readyState.
Solution 4 - Javascript
document.getElementsByTagName('audio').addEventListener('playing',function() { myfunction(); },false);
Should do the trick.
Solution 5 - Javascript
Try this function! Audio playing would not be executed if the position is the beginning or ending
function togglePause() {
if (myAudio.paused && myAudio.currentTime > 0 && !myAudio.ended) {
myAudio.play();
} else {
myAudio.pause();
}
}
Solution 6 - Javascript
I wondered if this code would work, and it amazingly did:
if (a.paused == false) {
/*do something*/
}
or you could write it as:
if (!a.paused == true) {
/*do something*/
}
if you want your IDE annoying you in JSfiddle.
Solution 7 - Javascript
you can to use the onplay event.
var audio = document.querySelector('audio');
audio.onplay = function() { /* do something */};
or
var audio = document.querySelector('audio');
audio.addEventListener('play', function() { /* do something */ };
Solution 8 - Javascript
Try Out This Code:
var myAudio = document.getElementById("audioFile");
function playAudio() {
//audio.play();
//console.log(audio.play())
if (myAudio.paused && myAudio.currentTime >= 0 && !myAudio.started) {
myAudio.play();
console.log("started");
} else {
myAudio.pause();
}
}
Solution 9 - Javascript
To check if audio is really start playing, especially if you have a stream, need to check audio.played.length
to 1
. It will be 1 only if audio is really start sounds. Otherwise will be 0
. It's more like a hack, but that still works even in mobile browsers, like Safari and Chrome.
Solution 10 - Javascript
I do this way
<button id="play">Play Sound</button>
<script>
var sound = new Audio("path_to_sound.mp3")
sound.loop = false;
var play = document.getElementById("play")
play.addEventListener("click", () => {
if (!isPlaying()) {
sound.play()
} else {
//sound.pause()
}
})
function isPlaying() {
var infoPlaying = false
var currentTime = sound.currentTime == 0 ? true : false
var paused = sound.paused ? true : false
var ended = !sound.ended ? true : false
var readyState = sound.readyState == 0 ? true : false
if (currentTime && paused && ended && readyState) {
infoPlaying = true
} else if (!currentTime && !paused && ended && !readyState) {
infoPlaying = true
}
return infoPlaying
}
</script>
Solution 11 - Javascript
am using this jquery code withe tow button play and stop, play button is a play and pouse button
const help_p = new Audio("audio/help.mp3");//Set Help Audio Name
$('#help_play').click(function() {//pause-Play
if (help_p.paused == false) {
help_p.pause();//pause if playing
} else {
help_p.play();//Play If Pausing
}
});
$('#help_stop').click(function() {//Stop Button
help_p.pause();//pause
help_p.currentTime = 0; //Set Time 0
});
Solution 12 - Javascript
While there is no method called isPlaying or something similar, there are a few ways to accomplish this.
This method gets the % of progress as audio is playing:
function getPercentProg() {
var myVideo = document.getElementById('myVideo');
var endBuf = myVideo.buffered.end(0);
var soFar = parseInt((endBuf / myVideo.duration) * 100);
document.getElementById('loadStatus').innerHTML = soFar + '%';
}
If percent is greater than 0 and less than 100, it is playing, else it is stopped.