重复执行jQuery ajax调用

Question

如何每隔10秒重复执行jQuery ajax调用？

$(document).ready(function() {
    $.ajax({    
        type: "GET",    
        url: "newstitle.php",   
        data: "user=success",    
        success: function(msg) {
            $(msg).appendTo("#edix");    
        }  
    });

我尝试将$.ajax包装在一个函数中，并使用setInterval调用该函数

$(document).ready(function() {
    function ajaxd() { 
        $.ajax({
            type: "GET",
            url: "newstitle.php",
            data: "user=success",
            success: function(msg) {
                $(msg).appendTo("#edix");
            }
        });
    }
    setInterval("ajaxd()",10000);
});

但它提示"ajaxd未定义"

- user370306

Answer 1

你的方法不应该放在 ready 方法内部，否则它将 仅限于 在那里使用而无法在外部使用。

$(document).ready(function() {
    setInterval(ajaxd, 10000);
});

function ajaxd() { 
  $.ajax({
   type: "GET",
   url: "newstitles.php",
   data: "user=success",
   success: function(msg){
     $(msg).appendTo("#edix");
   }
 });
}

- balexandre

---

不要说“谢谢”，只需给这个问题点赞。 - balexandre

我知道。但是当我尝试时，它显示“您需要等待5分钟才能批准答案”。 - user370306

等待者通常会得到好事。 - balexandre

Answer 2

更好的方法是使用setTimeout，这样只有在前一个请求完成后才会发出新的请求。

应该如何做

想象一下，由于某些原因（服务器故障、网络错误），请求所需的时间比定义的时间长。你将有许多同时进行的请求，这不是一个好的选择。如果将来决定将时间差从10秒缩短到1秒，会怎样呢？

$(function() {
  var storiesInterval = 10 * 1000;
  var fetchNews = function() {
    console.log('Sending AJAX request...');
    $.ajax({
      type: "GET",
      url: "newstitles.php",
      data: {
        user: 'success',
        some: ['other', 'data']
      }
    }).done(function(msg) {
      $(msg).appendTo("#edix");
      console.log('success');
    }).fail(function() {
      console.log('error');
    }).always(function() {
      // Schedule the next request after this one completes,
      // even after error
      console.log('Waiting ' + (storiesInterval / 1000) + ' seconds');
      setTimeout(fetchNews, storiesInterval);
    });
  }
  
  // Fetch news immediately, then every 10 seconds AFTER previous request finishes
  fetchNews();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

我知道，这已经过去6年了。但我仍然认为它对其他人很有价值。

为什么原作者的代码没有起作用？

需要注意的是，你的代码之所以没有起作用，主要是因为你将ajaxd()函数调用作为字符串传递给了setInterval函数。这不是一个好习惯，部分原因是因为setInterval函数希望函数被全局定义。你应该使用函数引用，就像我的例子一样。这样，函数定义在哪里以及它是否匿名并不重要。

- Wiktor Bednarz

Answer 3

$(document).ready(function() {

setInterval(function() { 
  $.ajax({
   type: "GET",
   url: "newstitle.php",
   data: "user=success",
   success: function(msg){
     $(msg).appendTo("#edix");
   }
 });
}, 10000);

});

- Curtis