html audio标签在iPhone手机上打开为什么controls不起作用

先贴代码:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <script type="text/javascript">
            function playSound(id) {
                var node = document.getElementById(id);
                if (node != null) {
                    node.Play();
                }
            }
        </script>
    </head>
    <body>
<audio id="hhh" src="img/1.wav" controls="controls"></audio>
    </body>
</html>

放在tomcat中启动效果图:
pc上:图片说明
iPhone手机浏览器:图片说明
求解

你是否有尝试修改的宽度,我设置100%后,效果显示ok,很大可能行是因为宽度不够,所以只显示播放/暂停按钮

audio的 controls属性只有一个值,就是controls="controls"
audio的样式是固定的,而且不同的浏览器中样式都不一样。

你可以把audio隐藏,用图片和div自定义一个播放器样式,通过audio的play()和pause()等方法和事件来操控audio对象。

操控audio的方法和事件
http://www.w3school.com.cn/tags/html_ref_audio_video_dom.asp
实例
https://www.jianshu.com/p/653a860b8dcb