在标准的
Java / SpringMVC / JSP / jQuery web-app中,我试图检测“Back”(或history.go(-1))事件,以便刷新(AJAX)摘要组件/面板内容时我返回到一个页面(我们可以在其中更改摘要组件显示的后端数据).
我在JavaScript中尝试了以下内容(关于StackExchange上的一些帖子,重新如何实现这一点):
<script type="text/javascript"> $(document).ready(function() { window.onpageshow = function(event) { console.log("Event:"); console.dir(event); if (event.persisted) { alert("non-jQuery - back to page - loaded from bfcache"); } else { alert("non-jQuery - loaded page from server"); } }; $(window).on("pageshow",function(event){ console.log("Event:"); console.dir(event); if (event.originalEvent.persisted) { alert("jquery - back to page - loaded from bfcache"); } else { alert("jquery - loaded page from server"); } }); }); </script>
我正在运行OpenSUSE Linux并尝试使用FireFox和Chrome(最新版本),但每次将事件的持久属性设置为false(我可以在JavaScript控制台中看到这一点,以及从上面的代码弹出的警报).每次,我的意思是,无论是从服务器加载还是通过后退按钮(或“后退”链接)再次显示.
我的目的是进行AJAX调用,如果页面通过Back按钮或history.go(-1)调用显示,则使用服务器的更新数据重新加载摘要组件/面板.
我还尝试设置一个卸载处理程序(什么都不做)以防止页面被放入bfcache但它似乎仍然显示一个bf-cached版本并且event.persisted(或event.originalEvent.persisted)设置为假.
解决方法
这似乎是
bug in Chrome(也是
present in IE11).
我找到了以下解决方法:
<input type="hidden" id="cacheTest"></input> <script> var input = document.querySelector('#cacheTest') if (input.value === "") { // the page has been loaded from the server,// equivalent of persisted == false } else { // the page has been loaded from the cache,// equivalent of persisted == true } // change the input value so that we can detect // if the page is reloaded from cache later input.value = "some value" </script>
这利用了这样的事实:在大多数浏览器中,当从缓存加载页面时,表单字段值也是守恒的.
原文地址:https://www.jb51.cc/js/155012.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。