html中的音频静音和取消静音按钮

Posted 2023-02-25

【中文标题】html中的音频静音和取消静音按钮

【英文标题】：Audio mute and unmute button in html

【发布时间】：2021-11-24 04:42:05

【问题描述】：

我正在创建一个包含多个音频的 html 页面。我想要一个静音按钮，它可以将该页面的所有音频一起静音，这样即使我们播放另一个音频，即使它播放但我们什么也听不到。

我指的是code mentioned here。

但它只创建一个切换按钮，而不是静音。

页面使用的音频标签如下：

            <audio id="audio_playo24">
                <source src="voice/vo3.mp3" type="audio/mp3" />
            </audio>

谁能指点我正确的方向？

谢谢。

【参考方案1】：

使用此代码尝试一次，它会正常工作。

javascript 代码

function toggleMute() 
   var myAudio = document.getElementById('audio_playo24');
   myAudio.muted = !myAudio.muted;

HTML 代码

<audio id="audio_playo24" controls>
   <source src="voice/vo3.mp3" type="audio/mp3" />
</audio>
<a href="javascript:void(0);" onclick="toggleMute()">Mute/Unmute</a>

【讨论】：

不适合我

我检查了您在音频标签中缺少属性controls。简单使用此控件将可见。如果仍想通过 javascript 控件使用静音/取消静音切换，则使用 toggleMute() 函数。此 URL 上提供的工作示例 jsfiddle.net/0ght2xpz

我在控制台上收到此错误：“Uncaught TypeError: document.getElementByID is not a function”导致代码无法正常工作

这段代码在哪里执行？在浏览器中？它肯定会在浏览器中工作。你能把你的代码放在jsfiddle.net，这样我就可以看到你在做什么错误。

document.getElementById 工作正常。在 ID 中使用小“d”。