Come posso visualizzare gli elementi di stringa ricevuti da json in base alla data e all'ora che dovrebbero essere visualizzati?

Question

Ho un database e memorizzo un testo, la sua durata e il momento in cui dovrebbe apparire sulla pagina web.

Il risultato del php è la seguente:

{"text_content":"dgsgdsgds","text_duration":"15","start_time":"2015-09-28 23:11:15"},{"text_content":"dgsgdsgds","text_duration":"15","start_time":"2015-09-28 23:11:30"},{"text_content":"gdsgdsgds","text_duration":"15","start_time":"2015-10-01 14:00:00"} 

Ho uno script jQuery che recupera i dati dal database e lo stampa sullo schermo:

var results =[]; 
var cursor = 0; 

function myFunction() { 
    $.getJSON('list2.php', function(json) { 
     results = json; 
     cursor = 0; 

     // Now start printing 
     printNext(); 
    }); 
} 

function printNext(){ 
    if(cursor == results.length){ 
     // Reset the cursor back to the beginning. 
     cursor = 0; 
    } 

    // Print the key1 in the div. 
    //$('#mydiv').html(results[cursor].key1); 
    $('#mydiv').hide('fast', function(){ $('#mydiv').html(results[cursor].text_content); $('#mydiv').show('fast'); }); 

    // Set a delay for the current item to stay 
    // Delay is key2 * 1000 seconds 
    setTimeout(function(){ 
     printNext(); 
    }, results[cursor].text_duration * 1000); 

    // Advance the cursor. 
    cursor++; 
} 

e ora volevo per aggiungere una funzionalità che il testo viene visualizzato sullo schermo solo in una data recuperata dal database, come start_time, ma non sono sicuro che sia possibile eseguire solo su jquery, senza ulteriore accesso al codice del server. I ho provato ad aggiungere alcune affermazioni come:

if(results[cursor].start_time == new Date()){ 

poco prima della stampa sullo schermo, ma non ha fatto il trucco. Potresti aiutarmi con quello? Grazie!

Answer 1

Analizzare la stringa JSON con JSON.parse:

var myObj = JSON.parse(results[0]); 

e confrontare il tuo start_time:

if (new Date(myObj.start_time) == new Date()) 

se si desidera eseguire la funzione sull'uso di tempo specifico setTimeout:

var diff = new Date(myObj.start_time).getTime() - new Date().getTime(); 
setTimeout(function() { 
    $('#mydiv').hide('fast', function() { 
     $('#mydiv').html(results[cursor].text_content); 
     $('#mydiv').show('fast'); 
    }); 
}, diff) 

o puoi eseguire la tua funzione ogni 1000 ms utilizzando setInterval e fermarlo con clearInterval:

function check() { 
    if (new Date(myObj.start_time) == new Date()) { 
     $('#mydiv').hide('fast', function() { 
      $('#mydiv').html(results[cursor].text_content); 
      $('#mydiv').show('fast'); 
     }); 
     clearInterval(myInterval); 
    } 
} 

var myInterval = setInterval(check, 1000)