如何使用静音道具取消静音 html5 视频答案

【问题标题】：How to unmute html5 video with a muted prop如何使用静音道具取消静音 html5 视频
【发布时间】：2016-12-26 18:53:24
【问题描述】：

我创建了一个简单的静音视频块（用于移动自动启动），但现在我无法更改静音状态...

我用过 repository ，小提琴链接会很棒。

到目前为止，我已经尝试过这个，但没有运气。

HTML

<video width="640" height="264" muted autoplay webkit-playsinline src="'+videoURL+'"></video>'

$(document).on("click",".containerVolume",function(e){
        if(isMuted){
            $('video').prop('muted', false);
        }
        else{
            $('video').prop('muted',true);
        }
});

var videos = document.querySelectorAll('video');
      if (location.search === '?enabled=false') 
      {
      } else if (location.search === '?enabled=true') {
           enableVideos(false);
      } else {
         enableVideos();
      }
      function enableVideos(everywhere) {
          for (var i = 0; i < videos.length; i++) {
             window.makeVideoPlayableInline(videos[i], !videos[i].hasAttribute('muted'), !everywhere);
          }
      }

【问题讨论】：

这个工作：document.getElementsByTagName("video")[0].removeAttribute("muted");

标签： javascript html video

【解决方案1】：

试试这个：

function toggleMute() {

  var video=document.getElementById("myVideo");

  video.muted = !video.muted;

}

检查示例here

如果您自己的代码不起作用，请尝试将id 添加到您希望点击注册并使用的视频/元素：

var video=document.getElementById("myVideo") ;   

$(video).on("click", function(e){
  video.muted = !video.muted;
});

【讨论】：

删除了静音属性，但视频仍然静音
我已经更新了我的答案。 .muted 是正确的方法，如果这不适用于您的特定代码，则可能存在其他问题。请检查链接的 JSFiddle 以获取工作示例。
根据您正在使用的存储库的链接：限制：需要用户交互才能播放有声视频（标准 iOS 限制） 不确定您是否可以解决操作系统问题限制。
视频自动播放但没有声音，即使用户操作也无法取消静音
如果我们有指向您的实时代码或重现问题的链接，这将更容易提供帮助。。跨度>

【解决方案2】：

Glen's Answer 是正确的，我只是想提供见解，说明为什么它对 Özgür、OP（和我自己，这就是我来到这里的原因）不起作用。

基本上归结为静音property和静音attribute是不同的。它似乎没有很好的记录（我发现），但我遇到的行为是 muted 属性（通过element.getAttribute 和相关方法访问）会影响初始状态，但切换它不会影响任何事情。另一方面。似乎 muted 属性（通过 videoEl.muted 访问，正如 Glen 指出的那样）是如何在页面加载后更改静音状态。

【讨论】：

【解决方案3】：

你应该使用videoEl.muted

var video = document.getElementById('video');

function toggleMute(){
  video.muted = !video.muted;
}

<video id="video" width="300" controls muted src="http://www.w3schools.com/html/mov_bbb.mp4"></video>

<br><br>
<a onclick="toggleMute()">Toggle Mute</a>

【讨论】：

@ÖzgürErsil - 你看视频了吗？
是的，它以静音开始，没有任何变化，我稍后会检查
@ÖzgürErsil – 嗯，很奇怪。这个对我有用。 .muted 有效：developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/muted
@ÖzgürErsil – 可能是 Firefox 的问题？ stackoverflow.com/a/32419889/484780
我稍后会检查（你的函数是内联的 toggleMute() 也许这就是原因）

【解决方案4】：

你可以简单地静音/取消静音

document.getElementById("theIdOfYourVideoGoesHere").volume=0;

和

document.getElementById("theIdOfYourVideoGoesHere").volume=1;

（这个帖子似乎有两年的历史，但今天它是我谷歌搜索的第一名）

Bilgisayar ne bilgiden anlar ne saygıdan。 Çünkü o cansız bir düzenektir。哦，卡达尔。

【讨论】：