Как обновить страницу с помощью jQuery?
Как обновить страницу с помощью jQuery?
Используйте location.reload()
:
$('#something').click(function() {
location.reload();
});
Функция reload()
принимает необязательный параметр, который может быть установлен на true
чтобы принудительно перезагрузить сервер, а не кеш. Параметр по умолчанию равен false
, поэтому по умолчанию страница может перезагружаться из кеша браузера.
Это должно работать на всех браузерах даже без jQuery:
location.reload();
Существует несколько неограниченных способов обновления страницы с помощью JavaScript:
location.reload()
history.go(0)
location.href = location.href
location.href = location.pathname
location.replace(location.pathname)
location.reload(false)
Если нам нужно было снова вытащить документ с веб-сервера (например, там, где содержимое документа изменяется динамически), мы передадим аргумент как
true
.
Вы можете продолжить создание списка:
window.location = window.location
window.self.window.self.window.window.location = window.location
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 Стандарт .
В неподдерживаемых браузерах, таких как Google Chrome, location.reload(true)
ведет себя так же, как location.reload()
.
location.reload()
или location.reload(false)
Перезагружает страницу, извлекает свежую, не кэшированную копию самого HTML-страницы страницы и выполняет запросы повторной проверки RFC 7234 для любых ресурсов (например, скриптов), которые кешировало браузер, даже если они свежи , RFC 7234 позволяет браузеру обслуживать их без повторной аттестации.
Насколько я могу сказать, как браузер должен использовать свой кеш при выполнении вызова location.reload()
не указывается и не документируется; Я определил поведение выше, экспериментируя.
Это эквивалентно тому, что пользователь просто нажимает кнопку «Обновить» в своем браузере.
location = location
(или бесконечно много других возможных методов, которые связаны с назначением location
или его свойствам) Работает только в том случае, если URL страницы не содержит хэширования /hashbang!
Перезагружает страницу без refetching или подтверждение значимости каких - либо свежих ресурсов из кэша. Если сам 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);
});
Вот решение, которое асинхронно перезагружает страницу с помощью 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
исправлений, которые Поскольку вопрос носит общий характер, попробуем подвести итог возможным решениям для ответа:
Простое решение для JavaScript :
Самый простой способ - это однострочное решение, размещенное соответствующим образом:
location.reload();
То, что многие люди отсутствуют здесь, потому что они надеются получить некоторые «точки», состоит в том, что сама функция reload () предлагает логический параметр (параметр: https://developer.mozilla.org/en-US/docs/Web /API /Местоположение /перезагрузка ).
Метод Location.reload () перезагружает ресурс из текущего URL-адреса. Его необязательный уникальный параметр - это логическое значение, которое, когда оно истинно, заставляет страницу всегда перезагружаться с сервера. Если он неверен или не указан, браузер может перезагрузить страницу из своего кеша.
Это означает, что есть два способа:
Решение1: принудительно перезагрузить текущую страницу с сервера
location.reload(true);
Решение2: Перезагрузка с кеша или сервера (на основе браузера и вашей конфигурации)
location.reload(false);
location.reload();
И если вы хотите объединить его с jQuery при прослушивании события, я бы рекомендовал использовать метод «.on ()» вместо «.click» или других оболочек событий, например, более правильным решением было бы:
$('#reloadIt').on('eventXyZ', function() {
location.reload(true);
});
я нашел
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 , просто используйте функцию перезагрузки на свойстве location следующим образом:
window.location.reload();
По умолчанию это перезагрузит страницу с помощью кеша браузера (если существует) ...
Если вы хотите сделать перезагрузку страницы, просто передайте истинное значение для перезагрузки, как показано ниже ...
window.location.reload(true);
Кроме того, если вы уже находитесь в области окна , вы можете избавиться от окна и сделать:
location.reload();
Если вы используете jQuery и хотите обновить, попробуйте добавить jQuery в функцию javascript:
Я хотел скрыть iframe со страницы при нажатии oh 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 и извлекает собственный элемент 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>
Все ответы здесь хороши. Поскольку вопрос указывает на перезагрузку страницы с помощью jquery , я просто подумал добавить что-то еще для будущих читателей.
jQuery - это кросс-платформенная библиотека JavaScript, предназначенная для упрощения клиентских сценариев HTML.
~ Википедия ~
Итак, вы поймете, что основа jquery или jquery основана на javascript . Поэтому переход с чистым javascript лучше, когда дело доходит до простых вещей.
Но если вам нужно решение jquery , вот что.
$(location).attr('href', '');
Простое решение для Javascript:
location = location;
<button onClick="location = location;">Reload</button>
Используйте onclick="return location.reload();"
в теге кнопки.
<button id="refersh-page" name="refersh-page" type="button" onclick="return location.reload();">Refesh Page</button>