25

如何使用 JS 将页面上的所有声音静音？

<audio>这应该使 HTML5和<video>标签以及 Flash 和朋友静音。

4

6 回答 6

28

这可以在 vanilla JS 中轻松完成：

// Mute a singular HTML5 element
function muteMe(elem) {
    elem.muted = true;
    elem.pause();
}

// Try to mute all video and audio elements on the page
function mutePage() {
    var elems = document.querySelectorAll("video, audio");

    [].forEach.call(elems, function(elem) { muteMe(elem); });
}

或者在 ES6 中：

// Mute a singular HTML5 element
function muteMe(elem) {
    elem.muted = true;
    elem.pause();
}

// Try to mute all video and audio elements on the page
function mutePage() {
    document.querySelectorAll("video, audio").forEach( elem => muteMe(elem) );
}

当然，这仅适用于<video>or<audio>元素，因为 Flash 或 JS 初始化音频等项目通常无法限制。

于 2016-05-13T20:03:30.840 回答
8

规则 #1：永远不要在页面加载时启用音频自动播放。

无论如何，我将使用 jQuery 展示 HTML5：

// WARNING: Untested code ;)

window.my_mute = false;

$('#my_mute_button').bind('click', function(){

    $('audio,video').each(function(){

        if (!my_mute ) {

            if( !$(this).paused ) {
                $(this).data('muted',true); //Store elements muted by the button.
                $(this).pause(); // or .muted=true to keep playing muted
            }

        } else {

            if( $(this).data('muted') ) {
                $(this).data('muted',false);
                $(this).play(); // or .muted=false
            }

        }
    });

    my_mute = !my_mute;

});

Flash Media Players 依赖于暴露给 JavaScript 的自定义 API（希望如此）。

但是你明白了，遍历媒体，检查/存储播放状态，静音/取消静音。

于 2012-12-26T20:20:23.617 回答
6

我是这样做的：

[].slice.call(document.querySelectorAll('audio')).forEach(function(audio) {
    audio.muted = true;
});
于 2016-11-15T11:37:58.007 回答
4

你可以做

[...document.querySelectorAll('audio, video')].forEach(el => el.muted = true)

或者

Array.from(document.querySelectorAll('audio, video')).forEach(el => el.muted = true)
于 2021-03-10T10:23:28.930 回答
1

@zach-saucier

function muteMe(elem) {elem.muted = false;elem.pause();}// Try to mute all video and audio elements on the page
function mutePage() {
    var elems = document.querySelectorAll("video, audio");

    [].forEach.call(elems, function(elem) { muteMe(elem); });
}

这对我有用

于 2021-07-15T08:00:58.870 回答
0

保留对数组中所有音频/视频元素的引用，然后创建一个函数，在设置.muted=true.

于 2013-03-26T14:52:16.090 回答