I'm trying to play audio when the user clicks on a text hiding the actual audio tag. It's working fine on android device's browser but not working on IOS (I have tried on iPhone)

By doing some research I've known that IOS doesn't download the file until a user action triggers it. Here I've used a function to trigger it when the user clicks on the text, but still, it is not working. Is there any way to achieve the functionality I want?

This is example code. I've written the actual code in reactJS.

<audio src='xyz' controls id="audio" style='display:none'></audio>
<h4 onclick='fun()'>play sound</h4>

<script>

function fun(){
let audio=document.querySelector('#audio');
audio.play();
}
</script>

I expect the audio to be played in IOS device

0 Answers