jQuery 使浏览器选项卡闪烁通知
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4371016/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Make browser tab flash a notification
提问by Josh
For security reasons, my website automatically signs users out after 5 minutes of inactivity. I achieve this through jquery timeouts which are reset any time the user does what I consider an "activity". To ensure security, the timeout of the cookie is also set to 5 minutes, and my jquery performs a heartbeat back to the server to ensure the cookie doesn't expire.
出于安全原因，我的网站会在用户闲置 5 分钟后自动注销。我通过 jquery 超时来实现这一点，每当用户执行我认为的“活动”时，这些超时就会重置。为了保证安全，cookie 的超时时间也设置为 5 分钟，我的 jquery 执行心跳回服务器，以确保 cookie 不会过期。
Currently, at about 4 minutes of inactivity, a jquery ui dialog pops up, warning the user of their impending timeout. The user can choose to stay signed in, sign out now, or do nothing and they are forced to sign out at the end of the 5 minutes.
目前，在大约 4 分钟不活动时，会弹出一个 jquery ui 对话框，警告用户即将超时。用户可以选择保持登录、立即退出或什么都不做，并在 5 分钟结束时强制退出。
My problem is that I want to make the tab flash/blink with a different background color to warn the user that something is going on while they weren't paying attention. I'm just not sure how to go about doing this.
我的问题是我想让标签以不同的背景颜色闪烁/闪烁，以警告用户在他们没有注意时发生了一些事情。我只是不知道该怎么做。
采纳答案by Josiah Ruddell
You can change the title of the page (this should also change the text in the tab).
您可以更改页面的标题（这也应该更改选项卡中的文本）。
document.title = 'New title';
Additionally you could do this in a setIntervalback and forth between the page title, and the information you are attempting to show the user. I have seen this behavior on gmail with incoming chat communication.
此外，您可以setInterval在页面标题和您试图向用户显示的信息之间来回执行此操作。我已经在 gmail 上看到这种行为与传入的聊天通信。
回答by Curt
It's not possible to change the background of a browser tab, at least not consistently across all.
无法更改浏览器选项卡的背景，至少不能始终如一。
As Josiah has mentioned, setIntervalcan be used to create a flashing page title.
正如 Josiah 所提到的，setInterval可用于创建闪烁的页面标题。
This javascript makes use of it:
这个 javascript 使用了它：
var PageTitleNotification = {
Vars:{
OriginalTitle: document.title,
Interval: null
},
On: function(notification, intervalSpeed){
var _this = this;
_this.Vars.Interval = setInterval(function(){
document.title = (_this.Vars.OriginalTitle == document.title)
? notification
: _this.Vars.OriginalTitle;
}, (intervalSpeed) ? intervalSpeed : 1000);
},
Off: function(){
clearInterval(this.Vars.Interval);
document.title = this.Vars.OriginalTitle;
}
}
This can be used like:
这可以像这样使用：
PageTitleNotification.On("User logged out!");
See my following blog post for more info:
有关更多信息，请参阅我的以下博客文章：
http://curtistimson.co.uk/js/create-a-flashing-tab-notification-page-title/
http://curtistimson.co.uk/js/create-a-flashing-tab-notification-page-title/
回答by Parish
You can also add an alertwindow. When user is in another tab, browser has an inbuilt feature of flashing the tabs (having alert). So, changing document title along with an alert will serve your purpose. Note : before showing alert , you need to first check if tab is active.
您还可以添加警报窗口。当用户在另一个选项卡中时，浏览器具有闪烁选项卡的内置功能（有警报）。因此，更改文档标题和警报将有助于您的目的。注意：在显示 alert 之前，您需要先检查选项卡是否处于活动状态。
回答by hunter
you can change the page title and that will show in the browser tab, but you can't change the background color or make it blink
您可以更改页面标题并显示在浏览器选项卡中，但您不能更改背景颜色或使其闪烁
