Question

我有以下代码，当窗口聚焦时应该将音频静音，但我一定做错了，因为它根本没有静音;

脚本

$(function() {
    $(window).focus(function() {
        console.log('Focus');
        /*getElementById('notificationsound').muted = true;*/
        $("#notificationsound").prop('muted', true); //mute

    });

    $(window).blur(function() {
        console.log('Blur');
    });
});

HTML

<audio id="notificationsound" src="sound/notify.mp3" preload="auto"></audio>

目标是仅在页面未被查看/失焦时播放通知声音（我正在使用此“脚本结构”，因为我可能稍后会向不同的状态添加更多内容）。

我知道我缺少一些非常基本的东西，因为我是初学者，并且因为它正确地在控制台中记录焦点/模糊。另外 - 我知道这很可能是与之前在这里问过的其他人非常相似的问题，但是我只能找到相当老的答案（我的代码所基于的）所以如果这不再是“现代”或最佳实践我会喜欢替代方法的例子。

如果需要或建议进行重大改变，非常感谢例子。

Answer 1

尝试$("#notificationsound").prop('muted', true); - 你错过了'＃'，它是JQuery中的Id选择器。

Answer 2

$("#notificationsound").stop();

或

$("#notificationsound").pause();
$("#notificationsound").currentTime = 0;

甚至使用JS：

var audio = new Audio('example.mp3');

允许这样的功能：

audio.currentTime=1;
audio.play();
audio.stop();
audio.pause();

甚至：

audio.volume = 0.5 //half

使用页面焦点上的JavaScript静音<audio>声音</audio>

2 个答案: