jQuery 用户在不同选项卡中时更改页面标题

Question

I have live chat on my page. I want to change the title (with something moving like in omegle.com) when a new message is received and the user is not in the same tab as the live chat. When the user returns to the tab, the title would return to normal.

I guess it should be done by jQuery. Do you know any plugins or how can I do that?

Answer 1

Title can only be edited like so:

document.title = "blah";

So you could do:

var origTitle = document.title;
document.title = "You have ("+x+") new messages - "+origTitle;

To make it flash you would have to do something with setTimeout() ;

var origTitle = document.title;
var isChatTab = false; // Set to true/false by separate DOM event.
var animStep = true;
var animateTitle = function() {
    if (isChatTab) {
        if (animStep) {
            document.title = "You have ("+x+") new messages - "+origTitle;
        } else {
            document.title = origTitle;
        }
        animStep = !animStep;
    } else {
            document.title = origTitle;
            animStep = false;
    }
    setTimeout(animateTitle, 5000);
};

animateTitle();

Answer 2

try

$('title').text("some text");

Update

Apparantly, in IE, $('title')[0].innerHTML returns the content of the <title> tag, but you can't set it's value, except using document.title . I guess this should be an improvement to the jQuery API, since $('title')[0] does return a DOMElement ( nodeType = 1 )...

Answer 3

$('title').text('your title') suffices.

To see if you're taking the right path, simply use IE's developer toolbar (F12) and go to console and write $('title') , you should see [...] in console. This means that $('title') is an object and it works up to here. Then write typeof $('title').text , and you should see function as the result. If these tests are OK, then your IE is broken.