有时,我们需要从一个javascript中手动重新加载一个网页。由于jquery是一个javascript框架。它可以很容易地做到这一点。
重新加载或刷新页面涉及到从缓存或服务器中检索数据和断言。断言是指来自服务器的javascript、HTML和样式。
有两种重新加载当前页面的方式。
- 缓存刷新:重新加载一个当前页面,从缓存中获取数据。
- 硬刷新:重新加载页面从服务器上获取数据
用Javascript来重新加载一个网页
在javascript中,你可以使用以下几行代码来刷新页面
location.reload(parameter);
默认参数是false ,从缓存中加载页面。
true强制重新加载网页:强制重新加载网页,从服务器上获取所有资产,如样式、js和HTML,清除缓存。
下面是一段代码,从缓存中重新加载一个页面。
location.reload()
location.reload(false)
下面是一个从服务器上强制重新加载网页的代码
location.reload(true)
或者你也可以使用窗口全局对象,如下图所示
window.location.reload() // reload from a cache
window.location.reload(false) // reload from a cache
window.location.reload(true) // reload from a server
使用按钮点击事件重新加载一个页面
有时,我们想使用按钮点击事件来重新加载一个页面。
要从缓存中重新加载,使用下面的代码
<button type="button" onclick="location.reload(false);">Refresh A page</button>
要从服务器上重新加载,请使用下面的代码
<button type="button" onclick="location.reload(true);">Refresh A page</button>
使用Jquery在点击按钮时重新加载一个页面
<button type="button" id="refreshButton">Reload</button>
<script type="text/javascript">
$('#refreshButton').click(function() {
location.reload();
});
</script>
使用历史记录来刷新页面
go() history 中的函数提供了一个重新加载页面的选项。
这里有一个HTML和javascript代码的例子,可以在点击按钮事件中重新加载一个当前页面。
<button type="button" onclick="refresh();">Reload</button>
<script type="text/javascript">
function refresh(){
history.go()
}
</script>
另一种方法是使用window.location.href
window.location.href=window.location.href;
如何在ajax成功回调中刷新当前页面。
有时,我们想在成功收到AJAX请求后重新加载一个页面。
下面是一个使用AJAX进行发布请求的代码。
$.ajax({
url: "API URL",
method: POST,
success: function(s,x){
location.reload(true);
}
});
响应为200代码时调用成功回调。
重载逻辑放在成功回调内,重新加载整个页面。
它有助于显示最新的CRUD操作。