Как я могу обновить страницу с помощью jQuery? - PullRequest
Новая
       116

Как я могу обновить страницу с помощью jQuery?

2282 голосов
/ 23 марта 2011

Как я могу обновить страницу с помощью jQuery?

Ответы [ 23 ]

16 голосов
/ 25 июня 2013

Функция jQuery Load также может выполнять обновление страницы: 

$('body').load('views/file.html', function () {
    $(this).fadeIn(5000);
});
14 голосов
/ 18 мая 2016

Вот решение, которое асинхронно перезагружает страницу, используя jQuery. Это позволяет избежать мерцания, вызванного window.location = window.location. В этом примере показана страница, которая постоянно перезагружается, как на панели инструментов. Он проверен в бою и работает на информационном телевизоре на Таймс-сквер. 

<!DOCTYPE html>
<html lang="en">
  <head>
    ...
    <meta http-equiv="refresh" content="300">
    <script src="//ajax.googleapis.com/ajax/libs/jquery/2.2.3/jquery.min.js"></script>
    <script>
    function refresh() {
      $.ajax({
        url: "",
        dataType: "text",
        success: function(html) {
          $('#fu').replaceWith($.parseHTML(html));
          setTimeout(refresh,2000);
        }
      });
    }
    refresh();
    </script>
  </head>
  <body>
    <div id="fu">
      ...
    </div>
  </body>
</html>

Примечания:

  • Использование $.ajax напрямую, как $.get('',function(data){$(document.body).html(data)}) , приводит к тому, что файлы css / js будут кешированы , даже если вы используете cache: true, поэтому мы используем parseHTML
  • parseHTML НЕ найдет тег body , поэтому все ваше тело нуждается в дополнительном делении, я надеюсь, что этот кусок знаний поможет вам однажды, вы можете догадаться, как мы выбрали идентификатор для этого div
  • Используйте http-equiv="refresh" на случай, если с javascript / server hiccup что-то пойдет не так, то страница ПОТРЕБНО перезагрузится, и вам не позвонят
  • Этот подход, вероятно, как-то приводит к утечке памяти, обновление http-equiv исправляет это
14 голосов
/ 02 октября 2015

Поскольку вопрос является общим, давайте попробуем суммировать возможные решения для ответа:

Простое простое решение JavaScript :

Самый простой способ - это одна строкаРешение помещено соответствующим образом: 

location.reload();

Чего здесь не хватает многим, потому что они надеются получить «очки», так это то, что сама функция reload () предлагает логический параметр в качестве параметра (подробнее: https://developer.mozilla.org/en-US/docs/Web/API/Location/reload).

Метод Location.reload () перезагружает ресурс с текущего URL-адреса. Его необязательный уникальный параметр - логический, который, если он равен true, заставляет страницу всегда перезагружаться изсервер. Если значение равно false или не указано, браузер может перезагрузить страницу из своего кэша.

Это означает, что существует два способа:

Solution1: Принудительная перезагрузкатекущая страница с сервера 

location.reload(true);

Solution2: Перезагрузка из кэша или сервера (в зависимости от браузера и вашей конфигурации) 

location.reload(false);
location.reload();

А если выхочу совместить это с JQПри прослушивании события я бы рекомендовал использовать метод ".on ()" вместо ".click" или других оболочек событий, например, более правильное решение будет: 

$('#reloadIt').on('eventXyZ', function() {
    location.reload(true);
});
12 голосов
/ 15 сентября 2016

Я нашел 

window.location.href = "";

или 

window.location.href = null;

также обновляет страницу.

Это значительно упрощает перезагрузку страницы, удаляя любой хэш. Это очень приятно, когда я использую AngularJS в симуляторе iOS, поэтому мне не нужно перезапускать приложение.

7 голосов
/ 27 мая 2018

Вам не нужно ничего из jQuery, чтобы перезагрузить страницу, используя чистый JavaScript , просто используйте функцию перезагрузки для свойства местоположения, например так: 

window.location.reload();

По умолчанию это перезагрузит страницу, используя кеш браузера (если существует) ...

Если вы хотите принудительно перезагрузить страницу, просто передайте значение true вперезагрузите метод, как показано ниже ... 

window.location.reload(true);

Также, если вы уже находитесь в области видимости , вы можете избавиться от окна и сделать: 

location.reload();
7 голосов
/ 05 марта 2018

Вы можете использовать JavaScript location.reload() метод.Этот метод принимает логический параметр.true или false.Если параметр true;страница всегда перезагружается с сервера.Если это false;который используется по умолчанию или с пустым параметром браузера перезагружает страницу из ее кэша.

С true параметром 

<button type="button" onclick="location.reload(true);">Reload page</button>

С default / false параметром 

 <button type="button" onclick="location.reload();">Reload page</button>

Использование jquery 

<button id="Reloadpage">Reload page</button>
<script type="text/javascript">
    $('#Reloadpage').click(function() {
        location.reload();
    }); 
</script>
4 голосов
/ 04 февраля 2019

использовать 

location.reload();

или 

window.location.reload();
3 голосов
/ 25 июля 2018

Если вы используете jQuery и хотите обновить, попробуйте добавить свой jQuery в функцию javascript:

Я хотел скрыть iframe со страницы при нажатии на h3, для меня это сработалоно я не смог щелкнуть элемент, который позволял мне просматривать iframe для начала, пока я не обновил браузер вручную ... не идеально.

Я попробовал следующее: 

var hide = () => {
    $("#frame").hide();//jQuery
    location.reload(true);//javascript
};

Должно работать смешивание простого jane javascript с вашим jQuery. 

// code where hide (where location.reload was used)function was integrated, below    
    iFrameInsert = () => {
        var file = `Fe1FVoW0Nt4`;
        $("#frame").html(`<iframe width=\"560\" height=\"315\" src=\"https://www.youtube.com/embed/${file}\" frameborder=\"0\" allow=\"autoplay; encrypted-media\" allowfullscreen></iframe><h3>Close Player</h3>`);
        $("h3").enter code hereclick(hide);
}

// View Player 
$("#id-to-be-clicked").click(iFrameInsert);
2 голосов
/ 02 октября 2018

Все ответы здесь хорошие.Поскольку вопрос касается перезагрузки страницы с помощью , я просто подумал добавить что-то еще для будущих читателей.

jQuery - это кроссплатформенная библиотека JavaScript , предназначенная для упрощения клиентского сценария HTML.

~ Википедия ~

Таким образом, вы поймете, что основа или основана на .Так что переход на чистый намного лучше, когда речь идет о простых вещах.

Но если вам нужно решение , вот один. 

$(location).attr('href', '');
2 голосов
/ 23 мая 2018

Используйте onclick="return location.reload();" в теге кнопки. 

<button id="refersh-page" name="refersh-page" type="button" onclick="return location.reload();">Refesh Page</button>
Страница:
...