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

2622
luca 23 Мар 2011 в 14:55

26 ответов

Лучший ответ

Используйте location.reload():

$('#something').click(function() {
    location.reload();
});

Функция reload() принимает необязательный параметр, который может быть установлен в true для принудительной перезагрузки с сервера, а не из кэша. Параметр по умолчанию равен false, поэтому по умолчанию страница может перезагрузиться из кэша браузера.

3784
Mark Amery 19 Окт 2015 в 20:20

Это должно работать во всех браузерах, даже без jQuery:

location.reload();
453
Peter Mortensen 14 Янв 2017 в 16:11

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

$('body').load('views/file.html', function () {
    $(this).fadeIn(5000);
});
17
Peter Mortensen 10 Авг 2013 в 08:50

Чтобы перезагрузить страницу с помощью jQuery, выполните:

$.ajax({
    url: "",
    context: document.body,
    success: function(s,x){
        $(this).html(s);
    }
});

Подход, который я здесь использовал, был Ajax jQuery. Я протестировал его на Chrome 13. Затем я поместил код в обработчик, который вызовет перезагрузку. URL - "", что означает эту страницу .

123
Peter 14 Сен 2015 в 13:11

window.location.reload() перезагрузится с сервера и снова загрузит все ваши данные, сценарии, изображения и т. Д.

Так что если вы просто хотите обновить HTML, window.location = document.URL вернется намного быстрее и с меньшим трафиком. Но он не перезагрузит страницу, если в URL есть хеш (#).

26
Peter Mortensen 14 Янв 2017 в 16:14

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

    location.reload(true);
    //Here, it will make a hard request or reload the current page and clear the cache as well.


    location.reload(false); OR location.reload();
    //It can be reload the page with cache
2
ankitkanojia 17 Сен 2019 в 10:19

Вы можете использовать

location.reload(forceGet)

forceGet является логическим и необязательным.

По умолчанию используется значение false, которое перезагружает страницу из кэша.

Установите для этого параметра значение true, если вы хотите, чтобы браузер получал страницу с сервера, чтобы также избавиться от кеша.

Или просто

location.reload()

Если вы хотите быстро и легко с кэшированием.

55
Peter Mortensen 14 Янв 2017 в 16:15

Вы можете использовать метод 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>
9
Roshana Pitigala 6 Мар 2018 в 10:58

Вы можете написать это двумя способами. 1-й - это стандартный способ перезагрузки страницы, также называемый простым обновлением .

location.reload(); //simple refresh

И еще один называется жесткое обновление . Здесь вы передаете логическое выражение и устанавливаете его в true. Это перезагрузит страницу, уничтожив старый кеш и отобразив содержимое с нуля.

location.reload(true);//hard refresh
1
Rohan Rao 19 Ноя 2019 в 08:47

Вопрос должен быть,

Как обновить страницу с помощью JavaScript

window.location.href = window.location.href; //This is a possibility
window.location.reload(); //Another possiblity
history.go(0); //And another

Вы избалованы выбором.

64
Peter Mortensen 10 Авг 2013 в 08:43

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

window.location.reload();

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

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

window.location.reload(true);

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

location.reload();
8
Alireza 27 Май 2018 в 04:53

Простое решение Javascript .

 location = location; 
<button onClick="location = location;">Reload</button>
1
hev1 10 Июл 2018 в 18:29
$(document).on("click", "#refresh_btn", function(event) 
{
     window.location.replace(window.location.href);
});
0
Ankush Kumar 5 Мар 2020 в 08:11

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

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

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

location.reload();

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

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

Это означает, что есть два пути:

Решение 1. Принудительная перезагрузка текущей страницы с сервера .

location.reload(true);

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

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

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

$('#reloadIt').on('eventXyZ', function() {
    location.reload(true);
});
16
Fer To 2 Окт 2015 в 09:31

Вот решение, которое асинхронно перезагружает страницу, используя 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, я надеюсь, что этот кусок знаний поможет вам однажды, вы можете догадаться, как мы выбрали идентификатор для этого div
  • Используйте http-equiv="refresh" на всякий случай, если что-то пойдет не так с javascript / server hiccup, тогда страница ПОТРЕБНО перезагрузится без вашего телефонного звонка
  • Этот подход, вероятно, как-то теряет память, обновление http-equiv исправляет
15
William Entriken 17 Май 2016 в 22:30

Вероятно, самый короткий (12 символов) - используйте history

history.go()
1
Kamil Kiełczewski 28 Окт 2019 в 08:41

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

location.reload();

Или

window.location.reload();
8
Christophe Le Besnerais 4 Фев 2019 в 14:35
<i id="refresh" class="fa fa-refresh" aria-hidden="true"></i>

<script>
$(document).on('click','#refresh',function(){
   location.reload(true);
});
</script>
1
Nirav Joshi 28 Ноя 2019 в 13:15

Если вы используете 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);
3
Tim Diekmann 25 Июл 2018 в 07:57

Я нашел

window.location.href = "";

Или

window.location.href = null;

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

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

14
Peter Mortensen 14 Янв 2017 в 16:13

Много способов будет работать, я полагаю:

  • window.location.reload();
  • history.go(0);
  • window.location.href=window.location.href;
197
Naveed 29 Авг 2012 в 08:46

Если текущая страница была загружена запросом POST, вы можете использовать

window.location = window.location.pathname;

Вместо того

window.location.reload();

Потому что window.location.reload() запросит подтверждение при вызове на странице, которая была загружена запросом POST.

107
Mark Amery 19 Окт 2015 в 21:36

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

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

~ Википедия ~

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

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

$(location).attr('href', '');
3
Roshana Pitigala 2 Окт 2018 в 16:03

Вот несколько строк кода, которые вы можете использовать для перезагрузки страницы с помощью jQuery .

Он использует оболочку jQuery и извлекает нативный элемент dom.

Используйте это, если вы просто хотите, чтобы в вашем коде было чувство jQuery , и вас не заботит скорость / производительность кода.

Просто выберите от 1 до 10, который соответствует вашим потребностям, или добавьте еще несколько, основываясь на схеме и ответах перед этим.

<script>
  $(location)[0].reload(); //1
  $(location).get(0).reload(); //2
  $(window)[0].location.reload(); //3
  $(window).get(0).location.reload(); //4
  $(window)[0].$(location)[0].reload(); //5
  $(window).get(0).$(location)[0].reload(); //6
  $(window)[0].$(location).get(0).reload(); //7
  $(window).get(0).$(location).get(0).reload(); //8
  $(location)[0].href = ''; //9
  $(location).get(0).href = ''; //10
  //... and many other more just follow the pattern.
</script>
-1
dcangulo 19 Сен 2018 в 06:56

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

<button id="refersh-page" name="refersh-page" type="button" onclick="return location.reload();">Refesh Page</button>
3
Frank 23 Май 2018 в 10:57

Это самый короткий в JavaScript.

window.location = '';
0
Na Nonthasen 28 Ноя 2019 в 09:24