AJAX isteği Periyodik olarak nasıl tetiklenir?

113

<meta http-equiv="Refresh" Content="5">

Bu komut dosyası, her 5 saniyede bir sayfayı yeniden yükler veya yeniler. Ama jQuery ve AJAX çağrısını kullanarak yapmak istiyorum. Mümkün mü?

jquery ajax

— user12345
kaynak

281

Diğerlerinin de belirttiği gibi setInterval ve setTimeout işini görecektir. Paul Irish tarafından bu mükemmel videodan öğrendiğim biraz daha gelişmiş tekniği vurgulamak istedim: http://paulirish.com/2010/10-things-i-learned-from-the-jquery-source/

Yineleme aralığından daha uzun sürebilecek periyodik görevler için (yavaş bir bağlantıdaki HTTP isteği gibi) en iyisi kullanmamaktır setInterval(). İlk istek tamamlanmadıysa ve başka bir istek başlatırsanız, paylaşılan kaynakları tüketen ve birbirinizi aç bırakan birden çok isteğinizin olduğu bir duruma düşebilirsiniz. Son istek tamamlanana kadar bir sonraki isteği planlamayı bekleyerek bu sorunu önleyebilirsiniz:

// Use a named immediately-invoked function expression.
(function worker() {
  $.get('ajax/test.html', function(data) {
    // Now that we've completed the request schedule the next one.
    $('.result').html(data);
    setTimeout(worker, 5000);
  });
})();

Basit olması için, planlama için başarı geri aramasını kullandım. Bunun olumsuz tarafı, başarısız bir isteğin güncellemeleri durdurmasıdır. Bundan kaçınmak için bunun yerine tam geri aramayı kullanabilirsiniz:

(function worker() {
  $.ajax({
    url: 'ajax/test.html', 
    success: function(data) {
      $('.result').html(data);
    },
    complete: function() {
      // Schedule the next request when the current one's complete
      setTimeout(worker, 5000);
    }
  });
})();

— drewish
kaynak

3

Bu özyinelemeli bir işlev çağrısı gibi değil mi? Cevabınız evet ise, o zaman yinelemeli olduğu için uzun bir süre tekrar tekrar çalışmasına izin verir misiniz? ajax başarıyla yürütmeye devam ettiği sürece sonsuz özyineleme durumu olabilir

— Rahul Dole

1

Ayrıca, setTimeout kullanırsanız, bu iş parçacığını bu kod bloğunun dışından durdurmanın bir yolu var mı? SetInterval'da olduğu gibi, clearInterval () 'ı çağırabilirsiniz.

— Rahul Dole

16

@RahulDole bu iyi bir soru ama yinelemeli değil. Doğrudan işçi işlevinden çağrılmaz, bu nedenle yığın büyümeye devam etmez. İkinci noktanız için, setTimeout () belgelerini kontrol edin ve clearTimeout () 'a aktarılabilen sayısal bir kimlik döndürdüğünü göreceksiniz.

— drewish

7

@RahulDole Chrome'da iseniz, bir işlevin çağrı yığınını görmek için console.trace () ile oynayın. SetTimeout () tarafından çağrılan işlevlerin çok kısa bir yığını olacaktır ve kesinlikle setTimeout () adlı işlevi içermeyecektir.

— 2013 saat

1

@Anupal sadece yeni bir soru oluşturun.

— drewish

34

Evet, çalıştırmak istediğiniz kodu çağırmak için JavaScript setTimeout()yöntemini veya setInterval()yöntemini kullanabilirsiniz. SetTimeout ile bunu şu şekilde yapabilirsiniz:

function executeQuery() {
  $.ajax({
    url: 'url/path/here',
    success: function(data) {
      // do something with the return value here if you like
    }
  });
  setTimeout(executeQuery, 5000); // you could choose not to continue on failure...
}

$(document).ready(function() {
  // run the first time; all subsequent calls will take care of themselves
  setTimeout(executeQuery, 5000);
});

— Tahbaza
kaynak

1

Sadece setTimeout (executeQuery, 5000) kullanın; setTimeout ('executeQuery ()', 5000) yerine; - daha kısa ve daha hızlı.

— rsp

4

Sen kullanabilir setTimeoutya setInterval.

Aradaki fark - setTimeout işlevinizi yalnızca bir kez tetikler ve sonra yeniden ayarlamanız gerekir. setInterval, durmasını söylemediğiniz sürece ifadeyi tekrar tekrar tetiklemeye devam eder

— Puneet
kaynak

1

Aşağıdaki kodu denedim,

    function executeQuery() {
  $.ajax({
    url: 'url/path/here',
    success: function(data) {
      // do something with the return value here if you like
    }
  });
  setTimeout(executeQuery, 5000); // you could choose not to continue on failure...
}

$(document).ready(function() {
  // run the first time; all subsequent calls will take care of themselves
  setTimeout(executeQuery, 5000);
});

Bu, belirtilen aralıkta beklendiği gibi çalışmadı, sayfa tam olarak yüklenmedi ve işlev sürekli çağrıldı. Onun daha iyi çağırmak setTimeout(executeQuery, 5000);dışında executeQuery(), aşağıdaki gibi ayrı bir işlevde

function executeQuery() {
  $.ajax({
    url: 'url/path/here',
    success: function(data) {
      // do something with the return value here if you like
    }
  });
  updateCall();
}

function updateCall(){
setTimeout(function(){executeQuery()}, 5000);
}

$(document).ready(function() {
  executeQuery();
});

Bu tam olarak amaçlandığı gibi çalıştı.

— Srihari
kaynak