每个会话仅显示一次加载屏幕

时间:2020-06-18 18:24:34

标签: javascript caching local-storage loading session-storage

我正在创建一个“伪加载屏幕”,一旦打开页面,该页面将在首页上显示整页div,并在几秒钟后消失。

我需要弄清楚的是,如何防止用户单击站点上的另一个页面然后返回首页(使用返回按钮或返回首页的锚链接)后显示此加载屏幕。

从本质上讲,我只需要在会话期间用户第一次访问该网站时显示加载程序,而在以后的会话中仅需要显示该加载器。

(如果刷新主页时隐藏了加载屏幕,并且如果用户在除主页之外的其他页面上开始会话,则出现了加载屏幕,这也是理想的选择)

我最好的猜测是,这将使用localStorage来实现,但是我是JS的新手,因此,关于如何实现此功能的任何建议都将很棒!

1 个答案:

答案 0 :(得分:0)

出于您的目的,您可以利用sessionStorage对象的window属性。显示加载屏幕后,您可以将此信息保存在sessionStorage中。例如:

sessionStorage.setItem('shown', true);

页面呈现后,您可以检查是否显示了加载屏幕:

if (!sessionStorage.getItem('shown')) showScreen();

只要打开浏览器,页面会话就会持续,并在重新加载和恢复页面后继续存在。您可以阅读more