Question

我制作了这个脚本来获取一些json信息：

 $(document).ready(function(){

    $.ajax({
      url: 'url',
      dataType: 'json',
      cache: true,
      timeout: 30000,
      success: function(data) {

            // $('#output ul').append('<li>The feed loads fine');
            $('#output ul').empty();

            $.each(data.posts, function(i,data){ 

                $('#output ul').append('<li><a href="'+data.image+'"><img class="thumb" src="'+data.image+'" alt="" /></a><h3>'+data.title+'</h3><p>'+data.text+'</p></li>');


            });

        },
        error: function(){
            $('#output ul').append('<li>Error');
        }
    });
 });

但我想每x秒更新一次Feed。我读了很多关于它但我可以完成它。

我该怎么做？

Answer 1

var foo = function() {
    $.ajax({
      url: 'url',
      dataType: 'json',
      cache: true,
      timeout: 30000,
      success: function(data) {

            // $('#output ul').append('<li>The feed loads fine');
            $('#output ul').empty();

            $.each(data.posts, function(i,data){ 

                $('#output ul').append('<li><a href="'+data.image+'"><img class="thumb" src="'+data.image+'" alt="" /></a><h3>'+data.title+'</h3><p>'+data.text+'</p></li>');


            });

        },
        error: function(){
            $('#output ul').append('<li>Error');
        }
    });
    setTimeout(foo, 3000);
}

foo();

3000是您在再次调用该函数之前要等待的毫秒数。

Answer 2

使用setInterval重复调用代码块，并将代码放在某个函数中，并将函数名称传递给setInterval第一个参数。您可以传递匿名函数，而不是像repeatMe那样创建一个新函数，但我更希望使函数能够使代码更具可读性。

function repeatMe(){
 $.ajax({
  url: 'url',
  dataType: 'json',
  cache: true,
  timeout: 30000,
  success: function(data) {

        // $('#output ul').append('<li>The feed loads fine');
        $('#output ul').empty();

        $.each(data.posts, function(i,data){ 

            $('#output ul').append('<li><a href="'+data.image+'"><img class="thumb" src="'+data.image+'" alt="" /></a><h3>'+data.title+'</h3><p>'+data.text+'</p></li>');


        });
    },
    error: function(){
        $('#output ul').append('<li>Error');
    }
 });
}

setInterval(repeatMe, 5000);

编辑最好在成功后使用setTimeout而不是setInterval，在第一次完成作业后发送下一次更新调用。我们还会将setTimeout置于错误状态，以保留重复的重复调用。

function repeatMe(){
 $.ajax({
  url: 'url',
  dataType: 'json',
  cache: true,
  timeout: 30000,
  success: function(data) {
        // $('#output ul').append('<li>The feed loads fine');
        $('#output ul').empty();
        $.each(data.posts, function(i,data){ 

            $('#output ul').append('<li><a href="'+data.image+'"><img class="thumb" src="'+data.image+'" alt="" /></a><h3>'+data.title+'</h3><p>'+data.text+'</p></li>');
            setTimeout(repeatMe, 5000);
        });
    },
    error: function(){
        $('#output ul').append('<li>Error');
        setTimeout(repeatMe, 5000);
    }
 });
}

Answer 3

setInterval(function(){

  $.ajax({
      url: 'url',
      dataType: 'json',
      cache: true,
      success: function(data) {

            // $('#output ul').append('<li>The feed loads fine');
            $('#output ul').empty();

            $.each(data.posts, function(i,data){ 

                $('#output ul').append('<li><a href="'+data.image+'"><img class="thumb" src="'+data.image+'" alt="" /></a><h3>'+data.title+'</h3><p>'+data.text+'</p></li>');


            });

        },
        error: function(){
            $('#output ul').append('<li>Error');
        }
    });

},30000);  //30000 == 30 seconds

Answer 4

$(document).ready(function(){
    setInterval(function() {
       $.ajax({
         url: 'url',
         dataType: 'json',
         cache: true,
         timeout: 30000,
         success: function(data) {    
            // $('#output ul').append('<li>The feed loads fine');
            $('#output ul').empty();

            $.each(data.posts, function(i,data){ 

                $('#output ul').append('<li><a href="'+data.image+'"><img class="thumb" src="'+data.image+'" alt="" /></a><h3>'+data.title+'</h3><p>'+data.text+'</p></li>');


            });

           },
            error: function(){
               $('#output ul').append('<li>Error');
           }
        });
    }, 1000 * x);
 });

上面的代码应该可以正常工作。只需在此处输入所需的秒数而不是x：1000 *x

请记住，您应该将指向函数的指针作为第一个参数传递给setInterval。如果只做setInterval($.ajax({...}), x)，你实际上说$ .ajax返回的函数应该每x秒执行一次。但它返回jQuery对象，而不是函数。这就是为什么在我的代码中，ajax包含function() {}

Json每隔x秒更新一次SetInterval

4 个答案: