Как перезагрузить страницу без уведомления пользователя?

Question

Я пытался выяснить, как перезагрузить страницу и вытащить динамическую информацию с сервера, не заметив, что страница была перезагружена. Например, если я хочу создать «живую» систему доски объявлений, когда плата обновляется каждый раз, когда другие люди делают комментарий или публикуют сообщение.

Я заметил, что Javascript имеет логическую функцию .reload(), когда при установке false выполняется перезагрузка страницы из кеша и при установке в true перезагружает страницу с сервера, но из того, что она выглядит, функция выполняет что-то подобное перезагрузке браузера. Есть ли другой способ делать то, что я пытаюсь сделать?

Answer 1

Что-то вроде этого ...

function getContent() 
{ 
    return new Promise(function(resolve, reject){ 

     var url = "http://yourendpoint.ext" 
     $.ajax({ 
      url: url, 
      success: function(data) 
      { 
       resolve(data); 
      }, 
      error: function(err) 
      { 
       reject(err); 
      } 
     }); 
    })); 

} 

// Usage 
getContent() 
.then(function(data) 
{ 
    $('#some-element').html(data); 
}); 

Answer 2

Вы уверены, что вы действительно хотите сделать перезагрузку?

Что вы можете сделать, это сделать запрос AJAX на сервер и отобразить результат, даже не перезагружая страницу. Я бы рекомендовал использовать jQuery для этого, просто из-за комфорта.

AJAX означает Асинхронный JavaScript и XML. В простой форме процесс может быть:

1. Дисплеев пользователя страницы, запускается таймер
2. Каждых 1 (или 20s или что угодно) сделать запрос AJAX с помощью JavaScript, прошу сервер для новых данных. Вы можете установить функцию обратного вызова, которая обрабатывает данные результата.
3. Сервер отвечает данными результата, функция обратного вызова вставляет новые данные.

Пример кода (из Jquery Docs):

$.ajax({ 
 
    method: "POST", 
 
    url: "target.php", 
 
    // Data to be sent to the server 
 
    data: { name: "John", location: "Boston" }, 
 
    // success will be called if the request was successfull 
 
    success: function(result) { 
 
\t // Loop through each Element 
 
\t $.each(result.newElements, function(index, value) { 
 
\t \t // Insert the Element to your page 
 
\t \t $('.classOfYourList').append(value); 
 
\t } 
 
    }); 
 
}); 
 

Просто установите правильную конечную точку вашего сервера в качестве цели и вставить все, что вы хотите сделать в функции успеха , Функция получит ответ, содержащий все, что вы отправили ему с сервера. Дополнительная информация в jQuery Документация:

Answer 3

Вы можете получить то, что хотите, используя AJAX. вы можете использовать ajax с javascript или jquery. Вы можете загружать содержимое, которое хотите динамически, без перезагрузки всей страницы. вот краткий пример.

Адрес <div> с идентификатором load, где будет загружен ваш контент.

<div id="load">Loaded Content:</div> 
    <button id="load_more">load more</button> 

JQuery для запроса данных, где getdata.php является PHP-файл, который будет посылать данные, которые вы хотите отобразить.

<script type="text/javascript"> 
$(document).ready(function(){ 
    $("#load_more").click(function(){ 
     $.post("getdata.php", {variable1:yourvariable, variable2:ifneeded},function(data){ 
     //data is the string or obj or array echoed from getdata.php file 
     $('#load').append(data); //putting the data into the loaded div. 
     } 
    }); 
    }); 
    }); 
</script>` 

наконец getdata.php файл

<?php 
    //fetch data from Databas eif needed. or echo ut what you want to display in the div. 
echo "This is a small example of using JQuery AJAX post request with PHP."; 
?> 

Надежда, что помогает!