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

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

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

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

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

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

location.reload();

Есть несколько неограниченных способов обновить страницу с помощью JavaScript:

1. location.reload()
2. history.go(0)
3. location.href = location.href
4. location.href = location.pathname
5. location.replace(location.pathname)

6. location.reload(false)

   Если бы нам нужно было снова извлечь документ с веб-сервера (например, когда содержимое документа динамически изменяется), мы бы передали аргумент как true.

Вы можете продолжить творческий список:

• window.location = window.location
• window.self.window.self.window.window.location = window.location
• ... и другие 534 пути

var methods = [
  "location.reload()",
  "history.go(0)",
  "location.href = location.href",
  "location.href = location.pathname",
  "location.replace(location.pathname)",
  "location.reload(false)"
];

var $body = $("body");
for (var i = 0; i < methods.length; ++i) {
  (function(cMethod) {
    $body.append($("<button>", {
      text: cMethod
    }).on("click", function() {
      eval(cMethod); // don't blame me for using eval
    }));
  })(methods[i]);
}

button {
  background: #2ecc71;
  border: 0;
  color: white;
  font-weight: bold;
  font-family: "Monaco", monospace;
  padding: 10px;
  border-radius: 4px;
  cursor: pointer;
  transition: background-color 0.5s ease;
  margin: 2px;
}
button:hover {
  background: #27ae60;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

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

• window.location.reload();
• history.go(0);
• window.location.href=window.location.href;

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

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

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

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

window.location = window.location.pathname;

вместо

window.location.reload();

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

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

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

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

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

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

location.reload(forceGet)

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

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

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

Или просто

location.reload()

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

Три подхода с различным поведением, связанным с кэшем:

• location.reload(true)

  В браузерах, которые реализуют forcedReloadпараметр location.reload(), перезагружается путем извлечения свежей копии страницы и всех ее ресурсов (скриптов, таблиц стилей, изображений и т. Д.). Не будет обслуживать какие-либо ресурсы из кэша - получает свежие копии с сервера без отправки каких-либо if-modified-sinceили if-none-matchзаголовков в запросе.

  Эквивалентно тому, что пользователь выполняет «жесткую перезагрузку» в браузерах, где это возможно.

  Обратите внимание, что передача trueв location.reload()поддерживается в Firefox (см. MDN ) и Internet Explorer (см. MSDN ), но не поддерживается универсально и не является частью спецификации W3 HTML 5 , ни спецификации проекта W3 HTML 5.1 , ни стандарта WHATWG HTML Living Standard .

  В неподдерживаемых браузерах, таких как Google Chrome, location.reload(true)ведет себя так же, как location.reload().

• location.reload() или location.reload(false)

  Перезагружает страницу, выбирая свежую, не кэшированную копию самого HTML страницы и выполняя запросы на повторную проверку RFC 7234 для любых ресурсов (например, сценариев), которые кэшируются браузером, даже если они свежие , если RFC 7234 позволяет браузеру обслуживать их без переаттестации.

  location.reload()Насколько я могу судить, точно, как браузер должен использовать свой кеш при выполнении вызова, не указано и не задокументировано; Я определил поведение выше экспериментально.

  Это эквивалентно тому, что пользователь просто нажимает кнопку «обновить» в своем браузере.

• location = location(или бесконечно много других возможных методов, которые включают присвоение locationили его свойства)

  Работает только в том случае, если URL-адрес страницы не содержит фрагмента / хэшбанга!

  Перезагрузка страницы без повторной проверки или повторной проверки любых свежих ресурсов из кэша. Если сам HTML страницы свежий, это перезагрузит страницу без каких-либо HTTP-запросов.

  Это эквивалентно (с точки зрения кэширования) пользователю, открывающему страницу в новой вкладке.

  Однако, если URL-адрес страницы содержит хэш, это не будет иметь никакого эффекта.

  Опять же, поведение кэширования здесь не определено, насколько я знаю; Я определил это путем тестирования.

Итак, в итоге вы хотите использовать:

• location = locationдля максимального использования кэша, пока страница не имеет хеша в своем URL, в этом случае это не будет работать
• location.reload(true)извлекать новые копии всех ресурсов без повторной проверки (хотя это не поддерживается повсеместно и будет вести себя не так, как location.reload()в некоторых браузерах, таких как Chrome)
• location.reload() чтобы точно воспроизвести эффект от пользователя, нажав кнопку «обновить».

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

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

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

$('body').load('views/file.html', function () {
    $(this).fadeIn(5000);
});

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

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

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

location.reload();

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

Метод 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);
});

Вот решение, которое асинхронно перезагружает страницу, используя 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обновление исправляет

я нашел

window.location.href = "";

или

window.location.href = null;

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

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

Вы можете использовать метод 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>

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

window.location.reload();

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

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

window.location.reload(true);

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

location.reload();

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

location.reload();

или

window.location.reload();

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

<button id="refersh-page" name="refersh-page" type="button" onclick="return location.reload();">Refesh Page</button>

Если вы используете 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);

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

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

^{~ Википедия ~}

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

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

$(location).attr('href', '');

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

    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

<i id="refresh" class="fa fa-refresh" aria-hidden="true"></i>

<script>
$(document).on('click','#refresh',function(){
   location.reload(true);
});
</script>

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

 location = location; 

<button onClick="location = location;">Reload</button>

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

history.go()

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

location.reload(); //simple refresh

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

location.reload(true);//hard refresh

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

window.location = '';

$(document).on("click", "#refresh_btn", function(event) 
{
     window.location.replace(window.location.href);
});

Вот несколько строк кода, которые вы можете использовать для перезагрузки страницы с помощью 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>