jQuery Ajax定期加载

i want to load the changes done to a particular document dynamically. the storysource.php would be given database connectivity and all. but presently only a echo statement is given for testing. the ajax works fine and data is getting loaded. but it is not reloading itself and changing the data as it changes.

<script>
function keertan()
{

    $.ajax({
    url: "storysource.php",
      success: function(result) {
      $('.centre').append('<div style="background-color:red;">'+result+'</div>');
        },
    complete:function(){
        setInterval('keertan',1000);
        }
        });

    }

            keertan();
    </script>

you can call a function like this :

    <script>
        function keertan()
        {
            $.ajax({
            url: "storysource.php",
            success: function(result) {
                $('.centre').append('<div style="background-color:red;">'+result+'</div>');
            },
        }

        keertan();

        setInterval(function(){
            keertan();
        },1000);

   </script>

Please note that setInterval() is often not the best solution for periodic execution - It really depends on what javascript you're actually calling periodically.

eg. If you use setInterval() with a period of 1000ms and in the periodic function you make an ajax call that occasionally takes 2 seconds to return you will be making another ajax call before the first response gets back. This is usually undesirable.

To achieve more robust periodic execution with a function that has a jQuery ajax call in it, consider something like this:

  <script>
function keertan()
{

    $.ajax({
    url: "storysource.php",
      success: function(result) {
      $('.centre').append('<div style="background-color:red;">'+result+'</div>');
        },
    complete:function(){
        setTimeout(keertan,1000); //instead of setInterval(keertan,1000);
        }
        });

    }

            keertan();
    </script>