音频静音-取消静音图标

Question

我想制作一个图标，让您静音或取消静音。图标本身有效，但音频不播放。这是代码：

<audio id="myaudio" controls loop>

  <source src="https://www.w3schools.com/jsref/horse.mp3" type="audio/mpeg">

  Your browser does not support the audio element.

</audio>

<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/3/3f/Mute_Icon.svg/1200px-Mute_Icon.svg.png" 

            style="height: 80px; width: 80px" id="imgClickAndChange" onclick="changeImage()"  />

</p>

<script language="javascript">

    

function changeImage() {

var x = document.getElementById("myAudio");

        if (document.getElementById("imgClickAndChange").src == "https://www.iconfinder.com/data/icons/octicons/1024/unmute-512.png") 

        {

            document.getElementById("imgClickAndChange").src = "https://upload.wikimedia.org/wikipedia/commons/thumb/3/3f/Mute_Icon.svg/1200px-Mute_Icon.svg.png";

             x.play();

 }

        else 

        {

            document.getElementById("imgClickAndChange").src = "https://www.iconfinder.com/data/icons/octicons/1024/unmute-512.png";

        x.pause();

}

    }

</script>

谁能帮我？

（也是的，我正在使用 w3schools 的声音）

Answer 1

x.muted 是解决方案：function changeImage() {&nbsp; &nbsp; var x = document.getElementById("myaudio");&nbsp; &nbsp; if (&nbsp; &nbsp; &nbsp; &nbsp; document.getElementById("imgClickAndChange").src ==&nbsp; &nbsp; &nbsp; &nbsp; "https://www.iconfinder.com/data/icons/octicons/1024/unmute-512.png"&nbsp; &nbsp; ) {&nbsp; &nbsp; &nbsp; &nbsp; document.getElementById("imgClickAndChange").src =&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "https://upload.wikimedia.org/wikipedia/commons/thumb/3/3f/Mute_Icon.svg/1200px-Mute_Icon.svg.png";&nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; x.muted = true;&nbsp; &nbsp; } else {&nbsp; &nbsp; &nbsp; &nbsp; document.getElementById("imgClickAndChange").src =&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; "https://www.iconfinder.com/data/icons/octicons/1024/unmute-512.png";&nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; x.muted = false;&nbsp; &nbsp; }}<audio id="myaudio" controls loop>&nbsp; <source src="https://www.w3schools.com/jsref/horse.mp3" type="audio/mpeg">&nbsp; Your browser does not support the audio element.</audio><img src="https://www.iconfinder.com/data/icons/octicons/1024/unmute-512.png"&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; style="height: 80px; width: 80px" id="imgClickAndChange" onclick="changeImage()"&nbsp; /></p>