无法在页面更改或刷新时保持全屏模式

Question

我目前正在开发一个网络管理面板，我使用 Font Awesome 图标实现了一个全屏切换按钮。这是相关的 HTML 片段：

<li class="nav-item">
<a class="nav-link" data-widget="fullscreen" href="#" role="button">
    <i class="fas fa-expand-arrows-alt fa-lg" style="color:#060606; padding-top:10px;"></i>
</a>

单击此按钮可成功打开和关闭全屏模式。但是，我遇到了一个问题：每当我导航到同一网站内的另一个页面或刷新当前页面时，全屏模式就会自动退出。

我已尝试解决此问题，但未能找到解决方案。有人可以提供有关如何在页面更改或刷新时保持全屏模式的指导吗？

任何帮助或见解将不胜感激。谢谢！

Answer 1

要保持全屏，您可以在本地存储中添加一个标志。一旦您将应用程序设置为全屏，该标志将设置为 true。现在，您可以添加一个 onload 方法并检查该标志是否存在于您的本地存储中，如果存在，您可以再次进入全屏。一旦退出全屏，请将标志设置为 false。

参考 - https://developer.mozilla.org/en-US/docs/Web/API/Window/load_event