0

I have html5 audio like this in my page

 <audio id="audioplayer" playsinline controls muted loop autoplay hidden>
            <source src="audio/muzyka_meed_loop.mp3" type="audio/mpeg">
            Your browser does not support the audio element.
  </audio>

Here I am adding a random number to audio src to prevent cache

<script>
    $(document).ready(function(){
        document.querySelector('#audioplayer source').setAttribute('src', 'audio/muzyka_meed_loop.mp3?rand=' + Math.random());

    })
</script>

But now when I refresh the page the audio is not playing while there is autoplay on audio tag

Here is live page : live demo

What am I doing wrong?

2 Answers 2

3

Remove the autoplay attribute:

 <audio id="audioplayer" src="audio/muzyka_meed_loop.mp3" type="audio/mpeg" loop="loop"> </audio>

JavaScript:

window.onload = function() {
    document.getElementById("audioplayer").play();
}

JQuery:

$(document).ready(function() {
    $("#audioplayer").get(0).play();
});
4
  • I am checking I will let you know Commented Aug 1, 2019 at 13:33
  • Hii Vikas I tried your solution here is live demo meed.audiencevideo.com , still facing the problem when I test on different computers ,I have added the window.onload at the head tag check out . Commented Aug 2, 2019 at 7:20
  • @user9964622 different computers means? it's working on some computer and not others? Commented Aug 2, 2019 at 7:41
  • Yes, try it in different browser eg opera or firefox Commented Aug 2, 2019 at 7:51
0

I found solution recently. You need to call videoplayer.play() method in onLoadedData event on HTML video element. This is example in React:

<video src={videoSource} ref={videoPlayer} onLoadedData={() => videoPlayer.current.play()}/>

I'm guessing it works with audio as well.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.