Html 自定义按钮使音频播放静音

我有下面的代码，我正在制作一个基于html的游戏。当玩家使用iframe继续玩游戏而不中断呼叫时，它会在后台延迟呼叫的播放

<audio onloadeddata="var audioPlayer = this; setTimeout(function() { audioPlayer.play(); }, 1500)">
<source src="call1.mp3" type="audio/mp3" />

我的问题是，如何在iFrame中创建一个自定义静音按钮，这样当播放器单击它时，它会将呼叫静音并隐藏按钮？

找到了答案

使用了以下代码：

HTML

<a href="#" id="mutebutton"><img src="mutecall.png"></a>
<div id="soundDiv">
<audio id="background_audio" onloadeddata="var audioPlayer = this; setTimeout(function() { audioPlayer.play(); }, 1500)">
<source src="call1.mp3" type="audio/mp3" />
</audio>
</div>

Javascript：

它的工作原理与所问的问题一样。 单击图像时，它会将音频静音并隐藏按钮

<script language="javascript">
$("#mutebutton").click(function() {
$(this).hide();
var div = document.getElementById("soundDiv");
div.parentNode.removeChild(div);
}); 
</script>