Простой JQuery AJAX скрипт

Question

Как мне сделать так, чтобы браузер вызывал страницу php и публиковал результаты в div каждые 10 секунд или около того?

Спасибо. Я только учусь jquery.

Answer 1

Это должно работать:

function loadResults(){
  $('div.to.update').load('yourpage.php')
  setTimeOut(arguments.callee, 10000)
}

loadResults()

Как это работает:

$('div.to.update').load('yourpage.php')

Эта строка вызывает ajax 'yourpage.php' и заполняет div результатами этой страницы (обратите внимание, что результатом вызова вашей страницы должна быть не целая страница, а всего лишь фрагмент)

setTimeOut(arguments.callee, 10000)

setTimeOut планирует вызов функции в будущем, в данном случае 10 секунд. функция, которая вызывает ее, сама функция, взятая из переменной 'arguments', к которой имеет доступ каждая функция. Это похоже на рекурсивную функцию, но с задержкой в ​​10 секунд.

Наконец, вы впервые вызываете функцию, чтобы запустить цикл.

EDIT:

Вы также можете вызвать функцию с помощью setInterval (), если вам нужно позже остановить цикл, просто сделайте это:

  function loadResults(){
      $('div.to.update').load('yourpage.php')
  }

  var interval_id = setInterval(loadResults,10000)

  // Later on when you want to stop the refresh...

  clearInterval(interval_id)

Answer 2

Вам нужен периодический апдейтер. Что-то вроде:

function callMeAtInterval()
{
     $.ajax({
                   method: 'get',
                   url : 'status.php',
                   dataType : 'text',
                   success: function (text) { $('#updateMe').html(text); }
                });

}
//causes callMeAtInterval() to get called every 5 seconds.
var holdTheInterval = setInterval(callMeAtInterval, 5000);

Функция jQuery $. Ajax получает выходные данные ресурса, заданного url , а обратный вызов success позволяет вам выполнить некоторую обработку с результатами, как в примере выше: 1008 *

('#updateMe').html(text);

заполняет элемент страницы id updateMe текстом, возвращаемым с сервера.

Answer 3

Стоит отметить, что setInterval будет выполнять эту функцию каждые 5 секунд (в приведенном примере karim79) независимо от хода выполнения ожидающих запросов AJAX. Если первый запрос занимает 3 секунды, setInterval отправит следующий запрос спустя 2 секунды, а не 5. Если вы действительно хотите, чтобы между успешным обновлением и следующим запросом было 5 секунд, вы можете использовать setTimeout в success функция обратного вызова. Это выглядит так:

function callMeAtInterval() {
    $.ajax({
       method: 'get',
       url : 'status.php',
       dataType : 'text',
       success: function (text) {
            $('#updateMe').html(text);
            setTimeout(callMeAtInterval, 5000);
            }
    });

}

Недостатком этого подхода является то, что один сбой setTimeout означает, что раздел не будет обновляться снова.