通过Ajax显示乳液的内容以刷新页面

Question

There is a script that gets through JSON data from the PHP-script. The data are fine. I can not get the data to be updated at intervals. Is updated, but the data are duplicated. Here is a working script that simply displays the data without refreshing.

<script type='text/javascript'> 
$(document).ready(function(){
  $.ajaxSetup ({  
    cache: false  
  });
  /* call the php that has the php array which is json_encoded */

  $.getJSON('api.php', function(data) {
    /* data will hold the php array as a javascript object */
    $.each(data, function(key, val) {
      $('ul').append('<li id="' + key + '">' + val.date + ' ' + 
      val.event + ' ' + val.region + ' ' + val.host + ' '+ val.type + 
      ' ' + val.info + '</li>');
    });
  });
});

Answer 1

You can use the setTimeout to poll your api.php page.

<script type='text/javascript'> 

    $(document).ready(function(){
        $.ajaxSetup ({  
           cache: false  
        });

        setTimeout(getData, 5000);

      });

      function getData(){
          $.getJSON('api.php', function(data) {
             /* data will hold the php array as a javascript object */
             $.each(data, function(key, val) {
                  $('ul').append('<li id="' + key + '">' + val.date + ' ' + val.event + ' ' + val.region + ' ' + val.host + ' '+ val.type + ' ' + val.info + '</li>');
             });
             setTimeout(getData, 5000);
          });
      }

</script>