使用 Jquery 将页面上的所有音频静音 [重复]

Question

作为叙事网站的一部分，我的页面中有许多不同的音频元素。每个音频元素都有一个 ID，因此可以在某些点调用它。任何时候播放的声音都不会超过一种。但是我还需要页面的静音按钮，据我所知，我不能使用 id，因为我需要它们取消静音回到最后一个声音，而不是全部取消静音（如果有道理的话）。有没有一种简单的方法可以将所有页面音频静音，然后再次取消静音而不触发所有音频播放？

以下是我的代码，但它显然不起作用，我不确定最好的方法是什么：

html:

    <audio id="streetsound" preload="auto" autoplay loop>
    <source src="assets/audio/1street.mp3" type="audio/mpeg">
    </audio>

    <audio id="seasonsound" preload="auto" loop>
    <source src="assets/audio/2seasons.mp3" type="audio/mpeg">
    </audio>

    <audio id="snowsound" preload="auto" loop>
    <source src="assets/audio/3snow.mp3" type="audio/mpeg">
    </audio>


 <div id="soundicon" style="display: none;">
    <a href="#" id="muteaudio"><img src="assets/images/sound.png" alt="cup" style="border:0;"></a>
    </div>

jquery：

$(function(){
    $('#muteaudio').click(function() {
       $('audio').pause("");

    });
});

Answer 1

试试这个。

 $('#muteaudio').click(function() {
     $('audio').each(function() {
            $(this).pause();
        });
    });

Answer 2

$('#muteaudio').click(function () {
    $('audio').each(function () {
        $(this).pause();
    });
});

应该工作 - 基于How to mute/unmute sound of an audio using javascript

使用.each() 会遍历所有存在的匹配元素，.pause() 显然会暂停<audio> 标签。