Как я могу обновить страницу с помощью jQuery?
26 ответов
Используйте location.reload()
:
$('#something').click(function() {
location.reload();
});
Функция reload()
принимает необязательный параметр, который может быть установлен в true
для принудительной перезагрузки с сервера, а не из кэша. Параметр по умолчанию равен false
, поэтому по умолчанию страница может перезагрузиться из кэша браузера.
Это должно работать во всех браузерах, даже без jQuery:
location.reload();
Функция jQuery Load
также может выполнять обновление страницы:
$('body').load('views/file.html', function () {
$(this).fadeIn(5000);
});
Чтобы перезагрузить страницу с помощью jQuery, выполните:
$.ajax({
url: "",
context: document.body,
success: function(s,x){
$(this).html(s);
}
});
Подход, который я здесь использовал, был Ajax jQuery. Я протестировал его на Chrome 13. Затем я поместил код в обработчик, который вызовет перезагрузку. URL - ""
, что означает эту страницу .
window.location.reload()
перезагрузится с сервера и снова загрузит все ваши данные, сценарии, изображения и т. Д.
Так что если вы просто хотите обновить HTML, window.location = document.URL
вернется намного быстрее и с меньшим трафиком. Но он не перезагрузит страницу, если в URL есть хеш (#).
Есть много способов перезагрузить текущие страницы, но каким-то образом, используя эти подходы, вы увидите, что страница обновлена, но не с несколькими значениями кэша, поэтому решите эту проблему или, если вы хотите сделать жесткие запросы, используйте приведенный ниже код.
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
Вы можете использовать
location.reload(forceGet)
forceGet
является логическим и необязательным.
По умолчанию используется значение false, которое перезагружает страницу из кэша.
Установите для этого параметра значение true, если вы хотите, чтобы браузер получал страницу с сервера, чтобы также избавиться от кеша.
Или просто
location.reload()
Если вы хотите быстро и легко с кэшированием.
Вы можете использовать метод 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>
Вы можете написать это двумя способами. 1-й - это стандартный способ перезагрузки страницы, также называемый простым обновлением .
location.reload(); //simple refresh
И еще один называется жесткое обновление . Здесь вы передаете логическое выражение и устанавливаете его в true. Это перезагрузит страницу, уничтожив старый кеш и отобразив содержимое с нуля.
location.reload(true);//hard refresh
Вопрос должен быть,
Как обновить страницу с помощью JavaScript
window.location.href = window.location.href; //This is a possibility
window.location.reload(); //Another possiblity
history.go(0); //And another
Вы избалованы выбором.
Вам ничего не нужно из jQuery, чтобы перезагрузить страницу с помощью чистого JavaScript , просто используйте функцию перезагрузки для свойства location следующим образом:
window.location.reload();
По умолчанию это перезагрузит страницу, используя кеш браузера (если существует) ...
Если вы хотите принудительно перезагрузить страницу, просто передайте значение true , чтобы перезагрузить метод, как показано ниже ...
window.location.reload(true);
Также, если вы уже находитесь в области окна , вы можете избавиться от окна и сделать:
location.reload();
Простое решение Javascript .
location = location;
<button onClick="location = location;">Reload</button>
$(document).on("click", "#refresh_btn", function(event)
{
window.location.replace(window.location.href);
});
Поскольку вопрос носит общий характер, давайте попробуем подытожить возможные решения для ответа:
Простое простое решение 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);
});
Вот решение, которое асинхронно перезагружает страницу, используя 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
исправляет
Вероятно, самый короткий (12 символов) - используйте history
history.go()
Использовать
location.reload();
Или
window.location.reload();
<i id="refresh" class="fa fa-refresh" aria-hidden="true"></i>
<script>
$(document).on('click','#refresh',function(){
location.reload(true);
});
</script>
Если вы используете 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);
Я нашел
window.location.href = "";
Или
window.location.href = null;
Также обновляет страницу.
Это значительно упрощает перезагрузку страницы, удаляя любой хеш. Это очень приятно, когда я использую AngularJS в симуляторе iOS, так что мне не нужно перезапускать приложение.
Много способов будет работать, я полагаю:
window.location.reload();
history.go(0);
window.location.href=window.location.href;
Если текущая страница была загружена запросом POST, вы можете использовать
window.location = window.location.pathname;
Вместо того
window.location.reload();
Потому что window.location.reload()
запросит подтверждение при вызове на странице, которая была загружена запросом POST.
Все ответы здесь хорошие. Поскольку в вопросе говорится о перезагрузке страницы с помощью jquery , я просто подумал добавить что-то еще для будущих читателей.
jQuery - это кроссплатформенная библиотека JavaScript , предназначенная для упрощения клиентский сценарий HTML.
~ Википедия ~
Таким образом, вы поймете, что основа jquery, или jquery основаны на записи javascript. Таким образом, использование чистого javascript намного лучше, когда оно приходит на простые вещи.
Но если вам нужно jquery, вот одно из них.
$(location).attr('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>
Используйте onclick="return location.reload();"
внутри тега кнопки.
<button id="refersh-page" name="refersh-page" type="button" onclick="return location.reload();">Refesh Page</button>
Это самый короткий в JavaScript.
window.location = '';
Похожие вопросы
Связанные вопросы
Новые вопросы
javascript
По вопросам программирования на ECMAScript (JavaScript/JS) и его различных диалектах/реализациях (кроме ActionScript). Обратите внимание, что JavaScript — это НЕ Java. Включите все теги, относящиеся к вашему вопросу: например, [node.js], [jQuery], [JSON], [ReactJS], [angular], [ember.js], [vue.js], [typescript], [стройный] и т. д.