禁用和重新启用功能，静音和取消静音

Question

Hi I am trying to disable a function with a click of a button and then enable it again once another button is clicked I have tried unbind but I am getting no where any suggestions to how I can go about this? 嗨，我试图通过单击一个按钮来禁用某个功能，然后在单击另一个按钮后再次启用它，但是我尝试取消绑定，但是我没有任何建议可以解决这个问题？

Code: 码：

<a href="#" class="MuteOn">Mute</a>
<a href="#" class="MuteOff">Unmute</a>

$('.MuteOn').on('click tap touch', function() {
//Disable soundListen function
 });

$('.MuteOff').on('click tap touch', function() {
//Enable soundListen function
 });

// //

setInterval(function soundListen() {
    if ($("body").hasClass("fp-viewing-1")) {
        audio1.play();

    } else {
        audio1.pause();
        audio1.currentTime = 0;
    }

    if ($("body").hasClass("fp-viewing-2")) {
        audio2.play();
    } else {
        audio2.pause();
        audio2.currentTime = 0;
    }

    if ($("body").hasClass("fp-viewing-3")) {
        audio3.play();
    } else {
        audio3.pause();
        audio3.currentTime = 0;
    }
}, 100);

Thank you in advance for any suggestions. 预先感谢您的任何建议。

Answer 1

Ok, so I understood it like this: -On first page user can click mute/unmute button and that should be saved during navigation through all other pages/slides. 好的，所以我这样理解：-在第一页上，用户可以单击“静音/取消静音”按钮，并且在浏览所有其他页面/幻灯片时应将其保存。

Then here is a code: 然后是一个代码：

<!doctype>
<html lang="en">
    <head>
        <meta http-equiv="Content-type" content="text/html; charset=utf-8">
        <title></title>
        <!-- Latest compiled and minified CSS -->
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

        <!-- jQuery library -->
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

        <!-- Latest compiled JavaScript -->
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    </head>
    <body>
        <button id="mute">Mute</button>
        <button id="unmute">Unmute</button>
        <button id="reloadPage">Reload Page</button>
        <script type="text/javascript">

            //get variable from local variables or set to false(you can change it to TRUE if you like to mute on page load) by default
            var isMuted = localStorage.getItem("IsMuted")||false;

            //mute button onclick method
            $(document).on('click','#mute',function(e){
                isMuted = true;
                //save to local variables
                localStorage.setItem("IsMuted", isMuted);
            }); 

            //unmute button onclick method
            $(document).on('click','#unmute',function(e){
                isMuted = false;
                //save to local variables
                localStorage.setItem("IsMuted", isMuted);
            }); 

            //reload page. also you can use F5 or Ctrl+F5
            $(document).on('click','#reloadPage',function(e){
                location.reload();
            });

            $(document).ready(function(){
                alert("IsMuted = "+isMuted);

                //you can encapsulate this into separate function and bind to show-next-slide button                
                if(isMuted)
                {
                    return;
                }
                else
                {
                    //get clip id by class name or another suitable method
                    PlayMyCoolMusic(clipId);
                }
            });



            function PlayMyCoolMusic(clipId)
            {
                //your audio player logic here

            }
        </script>
    </body>
</html>

With this you can save you mute/unmute status even if page has been reloaded. 使用此功能，即使页面已重新加载，也可以保存静音/取消静音状态。

禁用和重新启用功能，静音和取消静音

问题描述

1 个解决方案

解决方案1
1 已采纳 2017-07-14 05:51:35

禁用和重新启用功能，静音和取消静音

问题描述

1 个解决方案

解决方案1 1 已采纳 2017-07-14 05:51:35

解决方案1
1 已采纳 2017-07-14 05:51:35