点击时切换视频的静音

Question

我正试图在点击时将视频的音频静音，但出于某种原因，它不会静音..

HTML：

<video src="background/background1.mp4" autoplay="autoplay" loop="loop" id="background"> </video>

        <img src="button/audio_on.png" id="audio"/>

jquery / javascript解决方案我试过：

$('#audio').click(function() {
         if( $("#background").prop('muted', true) ) {
              $("#background").prop('muted', false);
              alert('music paused');
          } else {
              $("#background").prop('muted', true);
              alert('music playing');
          }
        });

注意：它确实警告音乐已暂停＆＃39;但从不提醒音乐播放＆＃39;

我试过的第二种方法（注意：它确实改变了img来源）：

 //change music icon
            $("#audio").on('dblclick', function(){
                $("#audio").attr("src","button/audio_on");
            document.getElementById("#background").volume = 1;


            });

                $("#audio").on('click', function(){
             $("#audio").attr("src","button/audio_off");
                    document.getElementById("#background").volume = 0;

            });

有谁知道为什么它不会使我的视频的音频静音？

Answer 1

尝试使用以下代码切换视频的音频：

   $("#audio").click( function (){
       $("#background").prop('muted', !$("#background").prop('muted'));
   });