如何使用 JavaScript 刷新页面?
例如,要在单击带有 id="something"
的元素时重新加载:
$('#something').click(function() {
location.reload();
});
reload()
函数采用可设置为 true
的可选参数,以强制从服务器而不是缓存重新加载。该参数默认为 false
,因此默认情况下页面可能会从浏览器的缓存中重新加载。
有多种使用 JavaScript 刷新页面的无限方法:
location.reload() history.go(0) location.href = location.href location.href = location.pathname location.replace(location.pathname) location.reload(false) 如果我们需要从网络上提取文档-再次服务器(例如文档内容动态更改的位置),我们会将参数作为 true 传递。
您可以继续创建有创意的列表:
窗口位置 = 窗口位置
window.self.window.self.window.window.location = window.location
...和其他 534 种方式
var方法= [“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($("
(reload()/(false))
较慢。嗯。有趣的。 :) 和 1 和 6 相同,reload()
的默认参数是 false
。
location.href = location.href
是我通常使用的,但感谢其他人。很有用! +1
我想很多方法都会奏效:
window.location.reload();
历史.go(0);
window.location.href=window.location.href;
example.com/something#blah
末尾有 #/hashbang,则此 window.location.href=window.location.href;
将什么都不做:
location.reload()
和 history.go(0)
之间的区别是什么:没有。 HTML 5 规范的相关部分 w3.org/TR/html5/browsers.html#dom-history-go 明确规定它们是等效的:“当调用 go(delta)
方法时,如果方法的参数被省略或值为 0,则用户代理必须就像调用了 location.reload()
方法一样。”
要使用 jQuery 重新加载页面,请执行以下操作:
$.ajax({
url: "",
context: document.body,
success: function(s,x){
$(this).html(s);
}
});
我在这里使用的方法是 Ajax jQuery。我在 Chrome 13 上对其进行了测试。然后我将代码放入将触发重新加载的处理程序中。 URL 是 ""
,表示此页面。
$.ajax
的 context
参数并期望它以某种方式执行某种魔术。它所做的只是set the this
value of callback functions。对 ""
的 URL 的 Ajax 将访问您当前所在的 URL,因此通常会加载完整的 HTML(包括 <html>
和 <head>
和 <body>
),并且此答案中的任何内容都不会过滤掉您不使用的内容不想。
如果当前页面是由 POST 请求加载的,您可能需要使用
window.location = window.location.pathname;
代替
window.location.reload();
因为如果在由 POST 请求加载的页面上调用 window.location.reload()
将提示确认。
window.location = window.location
也不完美;如果当前 URL 中有一个脆弱的(hashbang),它什么也不做。
问题应该是,
如何使用 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) 在实现 location.reload() 的强制重载参数的浏览器中,通过获取页面及其所有资源(脚本、样式表、图像等)的新副本来重新加载。不会从缓存中提供任何资源 - 从服务器获取新副本,而不在请求中发送任何 if-modified-since 或 if-none-match 标头。相当于用户在可能的情况下在浏览器中进行“硬重新加载”。请注意,Firefox(请参阅 MDN)和 Internet Explorer(请参阅 MSDN)支持将 true 传递给 location.reload(),但不受普遍支持,并且不是 W3 HTML 5 规范、W3 草案 HTML 5.1 规范的一部分,也不是WHATWG HTML 生活标准。在不支持的浏览器(如 Google Chrome)中,location.reload(true) 的行为与 location.reload() 相同。
location.reload() 或 location.reload(false) 重新加载页面,获取页面 HTML 本身的新的、非缓存的副本,并对浏览器缓存的任何资源(如脚本)执行 RFC 7234 重新验证请求,甚至如果它们是新鲜的,则 RFC 7234 允许浏览器在不重新验证的情况下为它们提供服务。据我所知,没有指定或记录浏览器在执行 location.reload() 调用时应该如何使用其缓存;我通过实验确定了上述行为。这相当于用户只需在浏览器中按下“刷新”按钮。
location = location(或涉及分配给 location 或其属性的无数其他可能的技术)仅在页面的 URL 不包含脆弱/hashbang 时才有效!重新加载页面而不从缓存中重新获取或重新验证任何新资源。如果页面的 HTML 本身是新鲜的,这将重新加载页面而不执行任何 HTTP 请求。这相当于(从缓存的角度来看)用户在新选项卡中打开页面。但是,如果页面的 URL 包含哈希,这将无效。同样,据我所知,这里的缓存行为是未指定的;我通过测试确定了它。
因此,总而言之,您要使用:
location = 最大使用缓存的位置,只要页面的 URL 中没有散列,在这种情况下,这将不起作用
location.reload(true) 在不重新验证的情况下获取所有资源的新副本(尽管它不是普遍支持的,并且在某些浏览器(如 Chrome)中的行为与 location.reload() 没有什么不同)
location.reload() 以忠实再现用户单击“刷新”按钮的效果。
location = location
不起作用。对于任何使用 fragid 的站点——甚至对于任何链接到页面的人可能会在 URL 中添加一个 fragid 的站点——这都会使其损坏。
window.location.reload()
将从服务器重新加载,并再次加载您的所有数据、脚本、图像等。
因此,如果您只想刷新 HTML,window.location = document.URL
将返回更快且流量更少。但如果 URL 中有井号 (#),它将不会重新加载页面。
location.reload()
强制重新验证缓存资源,即使没有参数,而 window.location = document.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)。
Location.reload() 方法从当前 URL 重新加载资源。它的可选唯一参数是一个布尔值,当它为真时,会导致页面总是从服务器重新加载。如果为 false 或未指定,浏览器可能会从其缓存中重新加载页面。
这意味着有两种方法:
解决方案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>
笔记:
像 $.get('',function(data){$(document.body).html(data)}) 直接使用 $.ajax 会导致 css/js 文件被缓存破坏,即使您使用 cache: true,这就是我们使用 parseHTML 的原因
parseHTML 不会找到 body 标签,所以你的整个身体都需要放在一个额外的 div 中,我希望这些知识有一天对你有所帮助,你可以猜到我们是如何为那个 div 选择 id
使用 http-equiv="refresh" 以防 javascript/server 出现问题,然后页面仍然会重新加载,而您不会接到电话
这种方法可能会以某种方式泄漏内存,http-equiv 刷新修复了
我发现
window.location.href = "";
或者
window.location.href = null;
还会刷新页面。
这使得重新加载删除任何哈希的页面变得非常容易。当我在 iOS 模拟器中使用 AngularJS 时,这非常好,这样我就不必重新运行应用程序。
您可以使用 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 属性上使用 reload 函数,如下所示:
window.location.reload();
默认情况下,这将使用浏览器缓存(如果存在)重新加载页面...
如果您想强制重新加载页面,只需将 true 值传递给 reload 方法,如下所示...
window.location.reload(true);
此外,如果您已经在 window 范围内,您可以摆脱 window 并执行以下操作:
location.reload();
利用
location.reload();
或者
window.location.reload();
这对我有用。
function reload(){
location.reload(true);
}
<i id="refresh" class="fa fa-refresh" aria-hidden="true"></i>
<script>
$(document).on('click','#refresh',function(){
location.reload(true);
});
</script>
你可能需要使用
location.reload()
或者也可能需要使用
location.reload(forceGet)
forceGet
是一个布尔值且可选。
如果您想强制浏览器从服务器获取页面以清除缓存,请将此参数设置为 true
在按钮标记中使用 onclick="return location.reload();"
。
<button id="refersh-page" name="refersh-page" type="button" onclick="return location.reload();">Refesh Page</button>
如果您正在使用 jQuery 并想要刷新,请尝试在 javascript 函数中添加 jQuery:
我想在单击哦 h3
时从页面中隐藏 iframe,对我来说它有效,但我无法单击允许我查看 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
你可以用两种方式写它。第一种是重新加载页面的标准方式,也称为简单刷新
location.reload(); //simple refresh
另一种称为硬刷新。在这里,您传递布尔表达式并将其设置为 true。这将重新加载页面,破坏旧缓存并从头开始显示内容。
location.reload(true);//hard refresh
简单的 Javascript 解决方案:
location = location;
$(document).on("click", "#refresh_btn", function(event)
{
window.location.replace(window.location.href);
});
它是 JavaScript 中最短的。
window.location = '';
你们可能需要使用
location.reload(forceGet)
forceGet
是一个布尔值且可选。
默认为 false,即重新加载缓存的页面。
window.location.href=window.location.href;
和location.href=location.href;
工作。window.location.reload(true);
将硬刷新,否则默认为 falsewindow.location.reload()
!location.reload();
是标准的 JavaScript。你不需要 jQuery。