代码之家 › 专栏 › 技术社区 › Luka Milani

闪烁的document.title和IE7(不可能?)

internet-explorer-7 dom javascript

Luka Milani · 技术社区 · 14 年前

我开发了一个网站,我需要让文件标题闪烁时,浏览器失去了重点,以获得用户的注意。

这是一个常见的任务,例如在一些社交网络中。顺便说一句,我的javascript代码在Chrome、Firefox、Opera中运行良好,但在IE7中运行不好(在发布网站之前我正在测试IE7)

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

// 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; 
}

3 回复 | 直到 14 年前

heyman 14 年前

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

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

如果您不使用jQuery,您可能仍然需要查看 source code (如果您想完全支持所有主流浏览器,在执行标题闪烁时需要处理一些奇怪的bug和边缘情况)。

Alex 14 年前

而不是 top.document.title 尝试 top.document.getElementsbyTagName('title')[0]

Alec Smart 14 年前

试试这个

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等没有触发你的闪烁功能。如果上述方法有效,则可以使用鼠标移动来跟踪超时。