仅在一个窗口中播放声音，该窗口使用javascript(可能是jquery）处于活动状态(在一个网站内）

Play sound only in one window of which is active (within one website) using javascript (possibly jquery)

本文关键字：一个 窗口 jquery 网站 活动状态 播放声音 javascript      更新时间：2023-09-26

好吧，我找到了一堆关于原生函数的答案，比如window.onblur和window.onfocus......但他们无济于事，所以我想更具体

  1. 假设您打开一个网站的多个选项卡
  2. 假设您收到一条消息，并且有声音宣布该消息
  3. 当您打开了多个选项卡时，您将听到打开的选项卡数量的声音。这让交响乐变得多么
    4. 响亮

到目前为止我找到的最佳解决方案，但不起作用1. 窗口对焦和窗口模糊2.如果var失焦的计算结果为真，则播放声音，否则不要播放3.它是跨浏览器的4.很简单5.它不起作用

为什么最好的解决方案不起作用？假设您将焦点切换到其他网站的另一个选项卡，您的网站会失去焦点，因此您将听不到声音。更糟糕的是，假设您切换到另一个程序，然后浏览器会失去焦点，您将听不到声音

那我该怎么办？

您可以将最后一个 onFocus(( 事件的时间戳保存在 JavaScript 变量和 cookie 中(访问设置为您的网站根目录(。然后，当您要播放警报声音时，您可以比较变量和 cookie 的当前值，并且仅在这两者匹配时才播放声音。

好吧，两周后，我似乎找到了真正的解决方案。这实际上证明了如果你想做某事，不要寻求帮助，只是去做

这是我所做的：

  1. 创建一个带有 randon id 和当前时间 (winid + t1( 的 cookie。Cookie 由加载时打开的每个选项卡创建。document.cookie = 'winid='+winid+t1;

    2. 创建一个函数，

  2. 该函数将每 3 秒更新一次设置的 cookie 中的当前时间(我有点不喜欢溢出客户端，所以它是 3 秒而不是 1(。如果函数发现 cookie 中的 winid 和当前选项卡的 winid 不匹配并且已经过去了 3 秒，则选项卡已关闭，在同一函数内重新定义主选项卡。window.setInterval(setwinid，3000(;

  3. 就是这样，每次你需要，比如说，播放一个声音，你应该先检查一下，它是否是要播放它的选项卡

诀窍是每个选项卡都有自己的 winid。但是只有一个winid存储在cookie中，被更新，因此允许一个选项卡执行操作。很简单。我实际上开始使用这种方法来更新所有选项卡中框中的消息，而不仅仅是为了播放音乐

一种解决方案是拥有一个服务器端解决方案，该解决方案只会播放一次通知。您没有指定站点如何接收消息，但我假设它是某种形式的 AJAX 调用，它从服务器获取消息并将消息保存在数据库中。

向数据库添加一个标志，表示消息已发送。 在用户的浏览器首次查询新邮件时设置标志。在页面本身上，仅当尚未设置标志时才播放声音，否则不要播放声音。现在，只有获取消息的第一页才会播放声音。

相关文章：