автоматическая перезагрузка: как это работает?

Question

Мне нужно что-то изменить на моем сайте, если некоторые поля изменились в базе данных, но без перезагрузки страницы! но я понятия не имею, как я могу это сделать. не могли бы вы дать мне идею? спасибо

пример:

например, у меня есть форум, и мне нужно показать изображение, если получен новый комментарий! я могу написать все функции, но я не понимаю, когда я должен вызвать функцию? может, window.onload?

Answer 1

Вы можете использовать jQuerys load- или JSON-метод для получения данных с вашего сервера.

В вашем случае возможен следующий сценарий:

1. Сайт загружается.
2. Ваш JavaScript загружает исходные данные с сервера.
3. Теперь каждые пару секунд или минут (в зависимости от вашего варианта использования) JavaScript запрашивает у сервера, изменилось ли что-либо с момента последнего запроса (например, используйте метки времени в вашем запросе).
4. Если это так, измените веб-сайт соответствующим образом.
5. Перейти к 3.

Имейте в виду, что чрезмерный опрос может привести к огромным нагрузкам на вашем сервере, особенно если у вас много пользователей. Длинный опрос или Comet - это передовые методы для обработки нагрузки.

Answer 2

Тогда вам нужно AJAX !

Пояснение:

Вам нужны две страницы, главная страница которых не «перезагружается». И второй, который возвращает две версии маленького изображения на основе поля базы данных.

На первой странице есть этот JavaScript:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script type="text/javascript">

/* normal ajax without periodical refresh
$.ajax({
  url: 'page2.php',
  success: function(data) {
    $('#database_status').html(data);
  }
});
*/

var refreshId = setInterval(function() {
     $('#database_status').load('/path/to/your.php');
}, 3000);
</script>

// Or you use the jQuery plugin Heartbeat: http://www.jasons-toolbox.com/JHeartbeat/ 

И Div <div id="database_status">empty</div>

Вторая страница возвращает тег изображения, основанный на настройке базы данных, например, в PHP:

<?php
// do db request 
if ($request) {
    echo '<img src="true.gif"> TRUE';
} else {
    echo '<img src="false.gif"> FALSE';
}

Answer 3

Ajax

Как только вы ознакомитесь с этой концепцией, вы можете обратиться к документации jQuery AJAX для получения информации о том, как реализовать ее с помощью jQuery.

Answer 4

Попробуйте Ajax, например: используя jquery, который позволяет вам обрабатывать те, которые находятся на высоком уровне js. пример на этом сайте, когда вы отправляете электронное письмо

Answer 5

Существует два основных подхода:

1. Используйте setInterval, чтобы периодически делать Ajax-запрос, который запрашивает у сервера какие-либо обновления.
2. Используйте Comet , чтобы подделать push сервера

Answer 6

Самый простой способ выполнить ajax-запрос с помощью jquery - это метод load . На этой странице вы также можете увидеть множество примеров.