h5 video ios播放过程中静音没有效果

如下的例子,在安卓手机上可以正常的播放、暂停、开启声音,关闭声音,但是在苹果手机上,关闭声音无效,通过setAttribute也没有效果,请大家帮忙看看,在线急等

例子代码如下

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>video</title>
    <style>
    html{
        font-size: 100px;
    }
        button{
            line-height: 40px;
            font-size: 30px;
        }
    </style>
</head>
<body>    
    <div>
        <button id="start">开始播放</button>
        <button id="sound">静音</button>
        <video id="myvideo" src="http://media.w3.org/2010/05/sintel/trailer.mp4" width="100%" height="90%" type="video/mp4" x5-video-player-type="h5" x5-video-player-fullscreen="true" x5-video-orientation="landscape" webkit-playsinline='true' style="object-fit: fill;"></video>
        

    </div>
    <script>
        var video = document.getElementById('myvideo');
        document.getElementById('start').addEventListener('click',function(){
            if(video.paused){
                video.play();
                this.innerText = "暂停";
            }else{
                video.pause();
                this.innerText = "开始播放";
            }
        })
        var flag = false;
        document.getElementById('sound').addEventListener('click',function(){
            flag = !flag;
            video.muted = flag;
            if(flag){
                this.innerText = "开启声音";
            }else{
                this.innerText = "静音";
            }
        })
    </script>
</body>
</html>
阅读 9k
2 个回答

iOS safari不支持muted属性,可查阅MDN

但是现在ios版本到10以上之后,好像是支持mute属性的

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
宣传栏