HTML5 Audio stop function

I am playing a small audio clip on click of each link in my navigation

HTML Code:

<audio tabindex="0" id="beep-one" controls preload="auto" >
    <source src="https://stackoverflow.com/questions/14834520/audio/Output 1-2.mp3">
    <source src="audio/Output 1-2.ogg">
</audio>

JS code:

$('#links a').click(function(e) {
    e.preventDefault();
    var beepOne = $("#beep-one")[0];
    beepOne.play();
});

It’s working fine so far.

Issue is when a sound clip is already running and i click on any link nothing happens.

I tried to stop the already playing sound on click of link, but there is no direct event for that in HTML5’s Audio API

I tried following code but it’s not working

$.each($('audio'), function () {
    $(this).stop();
});

Any suggestions please?

17 Answers
17

Leave a Comment