视频静音/取消静音按钮 javaScript答案

【问题标题】：Video mute/unmute button javaScript视频静音/取消静音按钮 javaScript
【发布时间】：2021-08-05 02:51:54
【问题描述】：

这里是 JavaScript 初学者！

我正在尝试为一个学校项目使用 javaScript 制作视频播放器，但我的静音按钮有问题。

我希望按钮在单击时使视频静音，并在再次按下按钮时取消静音。到目前为止，我只能将视频静音并保持静音。

这是我当前的静音按钮。

var button = document.getElementById('mute');
    button.onclick = function (){
        video.muted = true;
    };

我尝试了 if else 语句，但没有成功

var button = document.getElementById('mute');
    button.onclick = function (){

    if (video.muted = false) {    
           video.muted = true;
    }

    else {
        video.muted = false;
    }

    };

感谢您的帮助。

【问题讨论】：

当您尝试 if else 语句时发生了什么？您是否收到任何控制台错误？
没有错误，按钮停止工作。

标签： javascript if-statement audio html5-video mute

【解决方案1】：

if (video.muted = false) {    
       video.muted = true;
}

这应该是

if (video.muted === false) {    
       video.muted = true;
}

否则 else 语句将永远不会运行，因为您在 if 语句本身中每次都将 video.muted 设置为 false。

【讨论】：

不起作用，因为浏览器 chrome 显示错误 uncaughtexception.... 用户必须先与 DOM 交互。

【解决方案2】：

输入按位异或 (^)

video.muted ^= 1

【讨论】：

【解决方案3】：

原因是因为您实际上不是在检查 muted 属性是 false 还是 true，而是将 false 分配给 muted 属性。

所以你应该写如下：

if (video.muted === false) {    
    video.muted = true;
}
else {
    // your code
};

【讨论】：