Question

如何使用JavaScript在任务栏中使用户的浏览器闪烁/闪烁/突出显示？例如，如果我每10秒发出一次AJAX请求以查看用户是否在服务器上有任何新消息，我希望用户立即知道它，即使他当时正在使用其他应用程序。

编辑：这些用户确实希望在收到新邮件时分心。

Answer 1

这不会使任务栏按钮在更改颜色时闪烁，但标题将闪烁，直到它们移动鼠标。这应该跨平台工作，即使他们只是在不同的选项卡中。

newExcitingAlerts = (function () {
    var oldTitle = document.title;
    var msg = "New!";
    var timeoutId;
    var blink = function() { document.title = document.title == msg ? ' ' : msg; };
    var clear = function() {
        clearInterval(timeoutId);
        document.title = oldTitle;
        window.onmousemove = null;
        timeoutId = null;
    };
    return function () {
        if (!timeoutId) {
            timeoutId = setInterval(blink, 1000);
            window.onmousemove = clear;
        }
    };
}());

更新：您可能希望使用HTML5 notifications。

Answer 2

为了在浏览器标题栏中闪烁通知消息，我创建了一个jQuery plugin。您可以指定不同的选项，如闪烁间隔，持续时间，如果窗口/选项卡聚焦时闪烁应该停止等等。该插件适用于Firefox，Chrome，Safari，IE6，IE7和IE8。

以下是如何使用它的示例：

$.titleAlert("New mail!", {
    requireBlur:true,
    stopOnFocus:true,
    interval:600
});

如果您没有使用jQuery，您可能仍然希望查看source code（如果您想完全支持，那么在执行标题闪烁时需要解决一些奇怪的错误和边缘情况所有主流浏览器。）

Answer 3

据说你可以在windows上使用针对windows javascript API的增长：

http://ajaxian.com/archives/growls-for-windows-and-a-web-notification-api

您的用户必须安装咆哮。

最终，这将成为谷歌齿轮的一部分，以NotificationAPI的形式出现：

http://code.google.com/p/gears/wiki/NotificationAPI

所以我建议现在使用growl方法，如果可能的话，回到窗口标题更新，并且已经尝试使用Gears Notification API，以便最终变得可用。

Answer 4

我的“用户界面”响应是：您确定您的用户希望他们的浏览器闪烁，还是您认为这是他们想要的？如果我是那个使用你的软件的人，我知道如果这些警报经常发生并妨碍我，我会很生气。

如果您确定要这样做，请使用javascript警告框。这就是Google日历为活动提醒做的事情，他们可能会考虑一下。

网页确实不是需要知道警报的最佳媒介。如果您正在设计“ZOMG”的内容，那么服务器就会崩溃！向适当的人发送警报，自动发送电子邮件或短信可能会起到作用。

Answer 5

我能想到这样做的唯一方法就是在收到消息时做一些类似警报（'你有新消息'）的事情。如果窗口最小化，这将闪烁任务栏，但它也会打开一个您可能不需要的对话框。

Answer 6

为什么不采用GMail使用的方法并显示页面标题中的消息数量？

有时用户不希望在收到新邮件时分心。

Answer 7

                var oldTitle = document.title;
                var msg = "New Popup!";
                var timeoutId = false;

                var blink = function() {
                    document.title = document.title == msg ? oldTitle : msg;//Modify Title in case a popup

                    if(document.hasFocus())//Stop blinking and restore the Application Title
                    {
                        document.title = oldTitle;
                        clearInterval(timeoutId);
                    }                       
                };

                if (!timeoutId) {
                    timeoutId = setInterval(blink, 500);//Initiate the Blink Call
                };//Blink logic

Answer 8

您可能想尝试使用window.focus（） - 但如果屏幕切换可能会很烦人

Answer 9

您可以使用每封新邮件更改网页标题，以提醒用户。我为浏览器聊天客户端做了这个，大多数用户认为它运行良好。

document.title = "[user] hello world";

Answer 10

AFAIK，没有好办法保持一致性。我正在编写一个仅基于IE的基于Web的IM客户端。我们最终使用了window.focus（），它大部分时间都在工作。有时它实际上会导致窗口从前台应用程序窃取焦点，这可能真的很烦人。

Answer 11

这些用户确实希望在收到新邮件时分心。

听起来你正在为内部公司项目编写应用程序。

你可能想调查在.net中编写一个小的Windows应用程序，它会添加一个通知图标，然后当他们收到新消息时可以做一些花哨的弹出窗口或气球弹出窗口等。

这并不是太难，我确定你问'如何显示托盘图标'和'如何弹出通知'你会得到一些很好的答案： - ）

为了记录，我很确定（除了使用警报/提示对话框）你不能在JS中刷任务栏，因为这是特定于Windows的，并且JS真的不能像那样工作。您可能可以使用某些特定于IE的Windows activex控件，但随后您会对您的不良用户造成IE。不要这样做： - （

Answer 12

function blinkTab() {
        const browserTitle = document.title;
        let timeoutId;
        let message = 'My New Title';

        const stopBlinking = () => {
            document.title = browserTitle;
            clearInterval(timeoutId);
        };

        const startBlinking = () => {
            document.title = document.title  === message ? browserTitle : message;
        };

        function registerEvents() {
            window.addEventListener("focus", function(event) { 
                stopBlinking();
            });

            window.addEventListener("blur", function(event) {
                const timeoutId = setInterval(startBlinking, 500);
            });
        };

        registerEvents();
    };


    blinkTab();

Answer 13

“使浏览器窗口在任务栏中闪烁”

via Javascript

不可能！！

使任务栏中的浏览器窗口闪烁

13 个答案: