Question

我开发了一个网站，当浏览器失去焦点以引起用户的注意时，我需要让文档标题闪烁。

这是一个常见的任务，例如在某些社交网络中。顺便说一下，我的javascript代码在Chrome，Firefox，Opera中工作正常，但在IE7中没有（我在发布网站之前测试）

IE7有一个奇怪的行为，因为如果我在调试文本中打印document.title（你可以在代码中看到），它会被更改，但浏览器仍会显示以前的文档标题

我尝试在互联网上搜索很多，试图解决这个问题，但没有运气，所以我决定在这个网站上发布问题。在这里我的javascript代码如下，并提前感谢您的建议。

这个JS方法由this.blink（true）

调用

// other methods above and below ....

this.blink = function(Action)
{
    if (Action)
    {
        if (!this.blinking)
            this.oldTitle=top.document.title;
        else
            clearInterval(this.blinkTimer);

        // debug current title
        $('debugText').value = 'ORIGINAL ' + top.document.title + '\n' + $('debugHistory').value;

        this.blinkTimer = setInterval(function() {

            var msg='MSG', newTitle

            if (top.document.title == msg)
                newTitle =  '----';
            else
                newTitle =  msg;

            // assign title
        top.document.title =  newTitle;

            // debug blinking, is really changed but not shown <---
            $('debugText').value = 'BLINK ' + top.document.title + '\n' + $('debugHistory').value;

         }, 1000);

    }
    else
    {
        clearInterval(this.blinkTimer);

        if (this.blinking)
            top.document.title = this.oldTitle;
    }

    this.blinking = Action; 
}

Answer 1

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

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

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

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

Answer 2

而不是top.document.title尝试top.document.getElementsbyTagName('title')[0]（假设顶部是某种形式的框架或窗口）

Answer 3

在IE中试试这个

this.blink = function (Action)
{
     if (Action)
    {

        if (!this.blinking)
            this.oldTitle=top.document.title;
        else
            clearInterval(this.blinkTimer);


        this.blinkTimer = setInterval(function() {

            var msg='MSG', newTitle

            if (top.document.title == msg)
                newTitle =  '----';
            else
                newTitle =  msg;

            // assign title
        top.document.title =  newTitle;


         }, 1000);

    }
    else
    {
        clearInterval(this.blinkTimer);

        if (this.blinking)
            top.document.title = this.oldTitle;
    }

    this.blinking = Action; 
}
  window.blink('now');

主要是window.onblur等没有触发你的闪烁功能的问题。如果上述方法有效，那么您可以使用鼠标移动来跟踪超时。

document.title和IE7闪烁（没办法？）

3 个答案: