单击时切换视频的静音

Posted 2023-02-25

【中文标题】单击时切换视频的静音

【英文标题】：Toggle mute audio of video on click

【发布时间】：2014-11-04 08:21:03

【问题描述】：

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

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');
          
        );

注意：它会提示“音乐暂停”，但从不提示“正在播放音乐”

我尝试过的第二种方法（注意：它确实改变了 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;

            );

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

【参考方案1】：

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

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