Запускать ajax каждые 30 секунд и показывать таймер обратного отсчета

У меня есть функция, которую я хотел бы запускать каждые 30 секунд. Это отлично работает

$(document).ready(function(){
    setInterval(function() {
        jQuery.ajax({
            type: "GET",
            url: "loaddata.php",
            dataType:"json",
            success:function(response){
                if (response) {
                    // Process
                }
                else {
                    // Process 
                }
            }

        });
    }, 30000);
});

Но я пытаюсь понять, как я могу отобразить таймер обратного отсчета, встроенный в setInterval. Другими словами, он должен показать, сколько секунд осталось до запуска ajax, после запуска функции он должен сбросить таймер и снова отсчитать от 30 секунд. Этот процесс будет постоянно повторяться. Я нашел несколько примеров таймеров обратного отсчета, но понятия не имею, как синхронизировать их с запросами ajax и сбросить их.

Любая помощь приветствуется!


person Joshua Olds    schedule 09.01.2014    source источник
comment
Просто дополнение к решению @dhsto, но без (глобальной) переменной и setIntveral(). Вместо этого я использовал именованную функцию и setTimeout() - скрипку   -  person Andreas    schedule 09.01.2014


Ответы (1)


Просто запускайте функцию каждую секунду и получите счетчик, который обратится в обратный отсчет до 0. Когда он достигнет 0, запустите свой код ajax и сбросьте счетчик. Вот так:

var count = 30;
setInterval(function() {
    count--;

    // update timer here

    if (count === 0) {
        count = 30;
        // ajax code here
    }
}, 1000);

Установите начальное отображаемое значение в таймере на 30. Тогда это будет 29,28,27, ..., 2,1,0,29,28, и т. Д.

person David Sherret    schedule 09.01.2014