Перенаправление в 10, .. 9, ... сценарий

Question

Hy,

У меня есть 10 секунд. задержка.

var t = window.setTimeout('redirect(strUrl)', 11000); 

И функция редирект (strUrl) просто делает document.location

Что бы хорошо, если у меня есть небольшое сообщение отображения в нижней части моей страницы, например: Перенаправление через 10 секунд ...

"через одну секунду, что SetTimeout выстрелил"

... Перенаправление судьбе за 9 секунд ..

и т.д.

пс. и точки в конце идут слева направо, вы это знаете. .. ...

I myselft, вероятно, узнает, как получить каждую секунду таймаута, и только с помощью jquery изменилось число ... если бы это было возможно вообще.

Answer 1

var timeout = 11; // in seconds 

var msgContainer = $('<div />').appendTo('body'), 
    msg = $('<span />').appendTo(msgContainer), 
    dots = $('<span />').appendTo(msgContainer); 

var timeoutInterval = setInterval(function() { 

    timeout--; 

    msg.html('Redirecting in ' + timeout + ' seconds'); 

    if (timeout == 0) { 
     clearInterval(timeoutInterval); 
     redirect(strUrl); 
    } 

}, 1000); 

setInterval(function() { 

    if (dots.html().length == 3) { 
     dots.html(''); 
    } 

    dots.html(function(i, oldHtml) { return oldHtml += '.' }); 
}, 500); 

See it on jsFiddle.

Если вы хотите иметь второй (s) вещь, замените соответствующую строку выше ...

msg.html('Redirecting in ' + timeout + ' second' + ((timeout != 1) ? 's' : '')); 

Конечно, это работает хорошо с английским, но, вероятно, это не так просто, с другой языки.

Answer 2

Вы можете сделать это, создав div положение, которое вы абсолютно позиционируете с координатами bottom и left, и обновляйте текст в div путем циклического переключения на каждую секунду. Что-то вроде этого:

function redirect(strurl) { 
    var seconds = 10; 
    var div = $("<div/>").css({ 
    position: "absolute", 
    left: "0px", 
    bottom: "0px" 
    }).appendTo(document.body); 

    continueCountdown(); 

    function continueCountdown() { 
    --seconds; 
    if (seconds >= 0) { 
     div.text("...Redirecting in " + seconds + " seconds..."); 
     setTimeout(continueCountdown, 1000); 
    } 
    else { 
     // Redirect here 
     document.location = strurl; 
    } 
    } 
} 

Live example

Обратите внимание, что это будет неточным, потому что тайм-аут не обязательно стрелять в ровно одну секунду. Но это будет близко.

Answer 3

попробовать это:

var count=10; 

window.setTimeout(function(){redirect(url)}, 1000); 

function redirect(url){ 
    if(--count==0){ 
     location.href=url; 
     return; 
    } 
    $("#DIV_TO_DISPLAY_MESSAGE").text("redirecting in " + count+" secs."); 
    window.setTimeout(function(){redirect(url)}, 1000); 
} 

Answer 4

Определить переменную с числом секунд, и в SetTimeout (..., 1000) вызов функции будет уменьшаться ведьма количество секунд, содержание изменения некоторых-DIV/пролете. .., а если secs = 0 перенаправить.

Answer 5

Я бы пошел за countdown-plugin. есть example available