Question

我有一个javascript聊天。当用户收到消息时，我希望the title闪烁，直到它变为活动状态。（比如Gmail Talk）

例如：

您在其他标签页中。标题是My website
有人跟你说话。标题在My website和User says: bla bla
因此，您点击标签，现在标题为My website

如何使用jQuery实现这一目标？

到目前为止我尝试了什么:(眨眼永不停止播放）

var isOldTitle = true;
var oldTitle = "oldTitle";
var newTitle = "newTitle";
function changeTitle() {
     document.title = isOldTitle ? oldTitle : newTitle;
     isOldTitle = !isOldTitle;
     setTimeout(changeTitle, 700);
}
changeTitle();

Answer 1

完整解决方案：

var isOldTitle = true;
var oldTitle = "oldTitle";
var newTitle = "newTitle";
var interval = null;
function changeTitle() {
    document.title = isOldTitle ? oldTitle : newTitle;
    isOldTitle = !isOldTitle;
}
interval = setInterval(changeTitle, 700);

$(window).focus(function () {
    clearInterval(interval);
    $("title").text(oldTitle);
});

Answer 2

Pinouchon的回答是有效的，但是如果我必须添加间隔检查，那么当一个人连续多次发送消息时，它不会加快标题的更改。所以我有

if(timeoutId)
 {
     clearInterval(interval);
 }

 interval = setInterval(changeTitle, 700);

基本上如果已经设置了间隔，请将其清除然后重置。

Answer 3

请记得在焦点上致电clearInterval：

(function() {
  var timer,
      title = $('title'),
      title_text = title.text();
  $(window).blur(function() {
    timer = setInterval(function() {
      title.text(title.text().length == 0 ? title_text : '');
    }, 2000)
  }).focus(function() {
    clearInterval(timer);
    title.text(title_text);
  });
})();

Answer 4

你可以尝试这个。您可以调用闪烁功能开始在两个标题之间切换，并在您不再需要时调用停止。

var title = document.title;
var interval = 0;

function blink(title1, title2, timeout){
    title2 = title2 || title;
    timeout = timeout || 1000;

    document.title = title1;
    interval = setInterval(function(){
        if(document.title == title1){
            document.title = title2;
        }else{
            document.title = title1;
        }
    }, timeout);
}

function stop(){
    clearInterval(interval);
    document.title = title;
}



blink('My blinking title!');
setTimeout(function(){
    stop();
}, 5000)

如何使标题闪烁直到它变得活跃与jQuery？

4 个答案: