Блог

Главная - Вопросы по программированию - Асинхронно загружать несколько divs из базы данных?

Асинхронно загружать несколько divs из базы данных?

#php #jquery #mysql #ajax

#php #jquery #mysql #ajax

Вопрос:

Используя ajax и jQuery, я хотел бы автоматически обновлять некоторые divs каждые 5 минут, используя значения из базы данных.

Например:

 <div id="1">One</div>

<div id="2">Two</div>

<div id="3">Three</div>

<div id="4">Four</div>

id="1" является значением id соответствующего первичного ключа базы данных. Я хотел бы проверить этот ключ в базе данных, и если One он изменился, вместо div будет отображаться новый текст.

Какой был бы наилучший способ массового обновления этих значений асинхронно?

Комментарии:

1. Изменится ли количество divs при перезагрузке каждой страницы или они будут изменять каждый асинхронный вызов ajax?

2. Количество divs может меняться с каждым вызовом.

3. К вашему сведению, только числовые идентификаторы технически не разрешены. Они должны начинаться с альфа-значения. Хотя многие браузеры прощают это.

Ответ №1:

Пусть ваш клиентский скрипт создаст список идентификаторов, подлежащих проверке, и отправит их на сервер. Сервер может выполнить свой запрос, используя WHERE id IN (1,2,3,4) AND date_changed > $last_checked запрос типа. Создайте массив с ключами с этими идентификаторами:

 $array[] = array('id' => 1, 'txt' => "new text for div #1");
$array[] = array('id' => 4, 'txt' => "new text for div #4");

echo json_encode($array);

Когда клиент получит ответ от сервера, просто выполните итерацию по этому массиву и обновите соответствующие divs.

Таким образом, вы выполняете только один вызов AJAX, запускаете только один запрос, и один вызов скрипта обрабатывает обновление всех измененных divs. Это особенно полезно, если вы используете сеансы PHP на основе файлов по умолчанию. Если вы запускаете 4 ajax-вызова в коротком порядке, их придется обрабатывать последовательно, поскольку PHP блокирует файл сеанса, пока скрипт его использует. Время отклика уменьшится, поскольку каждый ajax-запрос может обрабатываться только последовательно, а не параллельно. Также меньше накладных расходов на HTTP, поскольку вы выполняете только один запрос, а не 4 отдельных.

Ответ №2:

Следуя идее Марка Б., для обработки jQuery вы могли бы сделать что-то вроде следующего:

jQuery

 var postString = 'check_ids=1,2,3,4';

$.get('/check-for-update', postString, function(response) {
  $(response).each(function() {
    $('div#'   this.id).html(this.txt);
  });
}, 'json');

В качестве дополнительного примечания не рекомендуется использовать только числа в качестве идентификаторов. Подумайте о том, чтобы добавить к ним что-то значимое, например entry_1 entry_2 и т. Д