Esegui Ajax ogni 30 secondi e mostra un timer di conto alla rovescia

Question

Ho una funzione che vorrei correre ogni 30 secondi.Questo funziona bene

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

        });
    }, 30000);
});

.

Ma sto cercando di capire come potrei visualizzare un timer di conto alla rovescia in linea con il setinterval.In altre parole, dovrebbe mostrare quanti secondi vengono lasciati prima che venga eseguito Ajax, una volta che funziona la funzione, deve ripristinare il timer e contare di nuovo da 30 secondi.Questo processo ripeterebbe continuamente.Ho trovato diversi esempi di timer di conto alla rovescia, ma non ho idea di come sincronizzarlo con richieste di Ajax e averlo resettato.

Qualsiasi aiuto è molto apprezzato!

Answer 1

Basta eseguire una funzione ogni secondo e avere un contatore che conta fino a 0. Quando colpisce 0, eseguire il codice Ajax e ripristinare il contatore.Come così:

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

    // update timer here

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

.

Impostare il valore visualizzato iniziale nel timer su 30. Quindi questo mostrerà 29.28,27, ..., 2,1,0,29,28, ecc.