我需要以某种方式检测用户是否按下了浏览器后退按钮,并使用jquery通过刷新(重新加载内容和CSS)重新加载页面。
如何通过jquery检测此类操作?
因为现在如果我在浏览器中使用后退按钮,一些元素不会被重新加载。但如果我在网站上使用链接,所有内容都会被刷新并正确显示。
重要!
有些人可能误解了我想要什么。我不想刷新当前页面。我想在按下后退按钮后刷新加载的页面。以下是我更详细的意思:
只需使用jQuery:
jQuery( document ).ready(function( $ ) {
//Use this inside your document ready jQuery
$(window).on('popstate', function() {
location.reload(true);
});
});
当使用ajax单击“后退”或“前进”按钮时,上述操作将100%起作用。
如果没有,则脚本的另一部分中肯定存在错误配置。
例如,如果在窗口中使用类似于上一篇文章中的一个示例的内容,它可能不会重新加载。历史pushState(“”,null,./”)
因此,当您使用
历史记录时。pushState()
确保正确使用它。
建议在大多数情况下,您只需要:
history.pushState(url, '', url);
没有窗户。历史并确保已定义url。
希望对你有帮助。。
这篇文章发布已经有一段时间了,但如果您不需要支持旧浏览器,我发现了一个更优雅的解决方案。
你可以和我核对一下
performance.navigation.type
此处提供了包括浏览器支持在内的文档:https://developer.mozilla.org/en-US/docs/Web/API/Performance/navigation
因此,要查看页面是否是使用back从历史加载的,您可以执行以下操作
if(performance.navigation.type == 2){
location.reload(true);
}
2
表示该页面是通过导航到历史记录来访问的。其他可能性包括-
0:
通过以下方式访问页面:链接、书签、表单提交或脚本,或在地址栏中键入URL。
1:
通过单击Reload按钮或通过Location.reload()方法访问页面。
255:
任何其他方式
这里有详细说明:https://developer.mozilla.org/en-US/docs/Web/API/PerformanceNavigation
注意性能。航行类型现在已被弃用,取而代之的是PerformanceNavigationTiming。返回“导航”/“重新加载”/“后退”/“预渲染”的类型:https://developer.mozilla.org/en-US/docs/Web/API/PerformanceNavigationTiming/type
您可以使用page eshow
事件来处理浏览器通过历史遍历导航到您的页面时的情况:
window.addEventListener( "pageshow", function ( event ) {
var historyTraversal = event.persisted ||
( typeof window.performance != "undefined" &&
window.performance.navigation.type === 2 );
if ( historyTraversal ) {
// Handle page restore.
window.location.reload();
}
});
请注意,也可能涉及HTTP缓存。您需要在服务器上设置适当的缓存相关HTTP头,以便仅缓存需要缓存的资源。您还可以强制重新加载以指示浏览器忽略HTTP缓存:窗口。地方重新加载(真)
。但我不认为这是最好的解决方案。
有关更多信息,请查看:
问题内容: 我会尽力解释这一点。 我有一个应用程序可以在页面上显示50多个项目。用户可以单击单个项目,然后转到页面以更新项目信息。一切工作正常,除了在用户完成更新单个项目信息并在浏览器上单击“后退”按钮到上一个按钮之后。旧项目信息(更新前)仍然存在。用户必须单击刷新才能查看更新的信息。不错,但我希望提供更好的用户体验。有解决这个问题的主意吗?非常感谢。 问题答案: 我认为您必须使用JS才能使此工作
问题内容: 我注意到一些浏览器(特别是Firefox和Opera)非常热衷于使用.css和.js文件的缓存副本,即使在浏览器会话之间也是如此。当你更新这些文件之一但用户的浏览器继续使用缓存的副本时,这会导致出现问题。 问题是:强制用户浏览器在文件更改后重新加载文件的最优雅方法是什么? 理想情况下,该解决方案不会强制浏览器在每次访问页面时重新加载文件。我将发布自己的解决方案作为答案,但我很好奇是否有
我当前正在Visual Studio2012中编辑一个.css文件(在调试模式下)。我用Chrome作为我的浏览器。当我在Visual Studio中对应用程序的.css文件进行更改并保存时,刷新页面时将不会加载在我的.css文件中更新的更改。我认为.css文件仍然被缓存。 我试过: Ctrl/F5 在Visual Studio 2012中,转到“项目属性”、“Web”选项卡,在“开始操作”部分“
问题内容: 我有一个按钮()。单击后,页面将重新加载。由于我有一些在页面加载时调用的jQuery 函数,因此导致这些元素再次被隐藏。我如何使按钮什么也不做,所以我仍然可以添加单击按钮但不重新加载页面时发生的某些操作。 问题答案: 不需要js或jquery。要停止页面重新加载,只需将按钮类型指定为“按钮”即可。如果您未指定按钮类型,浏览器会将其设置为“重置”或“提交”,从而导致页面重新加载。
我可以强制浏览器缓存WPS 6.1响应的页面吗? 强制浏览器缓存页面是满足要求的一种方式吗? 我尝试创建一个过滤器并在wps中配置它。 它正在工作,但HTTP标头仍然是: 缓存控制无缓存 内容语言en US 内容类型文本/html;charset=UTF-8 日期2012年5月11日星期五07:50:19 GMT 到期时间1970年1月1日星期四00:00:00 GMT IBM-Web2-Loca
本文向大家介绍手机浏览器 后退按钮强制刷新页面方法总结,包括了手机浏览器 后退按钮强制刷新页面方法总结的使用技巧和注意事项,需要的朋友参考一下 由于A界面的数据是通过ajax交互的,当你跳转到B界面,点击手机浏览器自带的后退回到A界面,由于缓存原因,读取到的数据不是最新的数据。 查了很多资料,看到网上的解决方法是清理缓存,然后页面重新向服务器发出请求。 下面整理一下,解决这个问题的方法。 方法1,