javascript 静音和取消静音按钮切换 html5 音频

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/7798530/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 01:22:12  来源:igfitidea点击:

mute and unmute button toggle html5 audio

javascripthtmlaudiotogglebuttonmute

提问by numerosept

I've understood how to mute an <audio>sound object by putting this code :

我已经了解如何<audio>通过放置以下代码来使声音对象静音:

<a href="#" onclick="document.getElementById('ambiance').muted = true; return false">
    mute sound
</a>

Now I'm searching how to mute/unmute my sound using the same button with the option to toggle it ?

现在我正在搜索如何使用相同的按钮和切换它的选项来静音/取消静音我的声音?

Can anyone give me directions?

谁能给我指路?

回答by Esailija

var audioElm = document.getElementById('ambiance'); audioElm.muted = !audioElm.muted;

回答by Mofizul I

Try this:

试试这个:

.unmute {
  background-image: url(http://franriavilla.in/images/unmute.png);
  background-size: cover;
  width: 35px;
  height: 30px;
  cursor: pointer;
}

.mute {
  background-image: url(http://franriavilla.in/images/mute.png);
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<audio id="track" autoplay="autoplay" loop="loop">
    <source src="audio/ThemePackNet.mp3" type="audio/ogg" />
</audio>

<div class='unmute' onclick="document.getElementById('track').muted = !document.getElementById('track').muted;$(this).toggleClass('mute')"></div>