2013-06-24 2 views
0

Я работаю над показом сообщения, которое само увольняется в природе. Через 5 секунд панель сообщений отклоняется. Однако, когда появляется несколько сообщений, поведение заключается в том, чтобы показывать несколько сообщений в одном контейнере, как только отображаемая панель сообщений отклоняется.Как установитьTimeout в уже установленную функцию в javascript

Для этого раз я показать бар с первым сообщением, вот Teh код самостоятельно уволиться после 5 секунд

window.setTimeout(function() { 
    bar.getValue('isVisible').setValue(false); 
    this.clearMessage(bar);// clears the message 
    bar._isShowing = false; 
     setTimeout(function() { 
      //execute the last action in the queue (if any) 
      dequeueAction(); fires the next message in queue. 
     }, 100); 
    }, 3000); 

Мой вопрос, когда есть еще одно сообщение, что был уволен перед первым сообщение уволено, я в очереди. Тем не менее, мне нужна значительная задержка между увольнением первого сообщения и показом второго сообщения в очереди. Но тайм-аут для задержки отображения второго сообщения не работает, поскольку он уже находится в пределах времени из 3000 мс.

Как я могу выполнить задержку в увольнении первого сообщения и показе второго сообщения? Примечание: он работает без второго setTimeout, но без задержки.

Любая помощь будет оценена по достоинству.

+0

Это не 3000 секунд, это 3000 миллисекунд, что составляет всего 3 секунды. –

+0

да, я понимаю. это была опечатка. – emeryville

+0

Не беспокойтесь, просто проверяя. –

ответ

0

Я не уверен на 100%, я понимаю вашу проблему. То, что я думаю, что вы говорите, что вы хотите:

  1. дисплейных сообщений, которые самостоятельно уволить
  2. если приходит сообщение, а один отображается, он находится в очереди
  3. раз текущее сообщение самостоятельной увольняет, должна быть короткой паузы перед отображением следующего

с этими целями:

//message queue 
var msgqueue = Array(); 
//displaying flag 
var msgdisplaying = null; 

//clear message and hide box/bar 
function clearMessage() { 
    msgdisplaying = null; 
    $('#msgbox').css('display','none'); 
} 

//queue message, start display if no message showing 
function displayMessage(msg) { 
    msgqueue.push(msg); 
    if (msgdisplaying === null) showMessage(); 
} 

//display message and set dismiss/delay timers 
function showMessage() { 
    if (msgqueue.length > 0) { 
     $("#msgbox").html("<h1>" + msgqueue.shift() + "</h1>").css('display','block'); 
     //dismiss this message after 3 seconds 
     setTimeout("clearMessage();",3000); 
     //display next message (if any) 0.1 seconds after dismissing 
     msgdisplaying = setTimeout("showMessage();", 3100); 
    }   
} 

jsfiddle

Если вы собираетесь использовать функцию JQuery .animate для анимации показа/скрытия сообщения DIV, установить тайм-аут для следующего блока с помощью обратного вызова аргумента, чтобы избежать таймаутов стрельбы во время анимации

//show 
$("#msgbox").html("<h1>" + msgqueue.shift() + "</h1>") 
$("#msgbox").animate({ 'opacity': 1 }, 500, 'swing', function() { 
    msgdisplaying = setTimeout("dismissMessage();", 3000) 
}); 

//hide 
$("#msgbox").animate({ 'opacity': 0 }, 500, 'swing', function(){ 
    if (msgqueue.length > 0) 
     msgdisplaying = setTimeout("showMessage();", 1000) 
    } else { 
     msgdisplaying = null 
    }); 

jsfiddle