如何在我的应用程序中添加静音按钮？

Posted 2023-02-25

【中文标题】如何在我的应用程序中添加静音按钮？

【英文标题】：How to add a mute button to my app?

【发布时间】：2015-07-14 15:05:33

【问题描述】：

我的应用中有一些会发出声音的事件。

例如，

循环播放的背景音乐 点击背景会发出声音 当两个矩形碰撞时会发出声音

我想要的是一个按钮，当单击该按钮时，可以在让声音播放和不让它们播放之间切换。

我不想在每个声音上都有大量的 if 语句，那么有没有办法解决这个问题？

这是我现在如何调用我的声音

//html
    <div id='mainRight'></div>

//JS
var mainRight = $('#mainRight');
    $(mainRight).width(windowDim.width/2).height(windowDim.height);
    $(mainRight).addClass('mainRight');

    var sounds = 

        coinHit : new Audio('./sound/coinCollect.wav'),
        playerClick : new Audio('./sound/playerClick.wav'),
        gameOver : new Audio('./sound/gameOver.wav'),
        backgroundMusic : new Audio('./sound/backgroundMusic.wav')

    

    sounds.backgroundMusic.addEventListener('ended', function() 
        this.currentTime = 0;
        this.play();

    , false);
    sounds.backgroundMusic.play();
    sounds.backgroundMusic.volume = 0.01;

    $('#mainRight').click(function()
    
        sounds.playerClick.load();
        sounds.playerClick.play();
    

【问题讨论】：

你的html在哪里？所以我们可以看到 UI .. #mainRight 是什么？

@JoshStevens 只是一个 div，现在添加适当的代码

【参考方案1】：

试试这个...

function toggleAudio() 
    for(var key in sounds) 
        sounds[key].muted = !sounds[key].muted;
    

每次按下静音按钮时都会触发它。它将切换sounds 对象中每个Audio 对象的静音状态。

【讨论】：

啊，太好了，我试一试，然后回复你:)