引导折叠式刷新设置

Bootstrap Accordion Refresh Settings

本文关键字：设置 刷新 折叠式      更新时间：2023-09-26

我在我的 Web 应用程序中使用引导文档中的代码有一个引导手风琴： 

<div class="accordion" id="accordion2">
  <div class="accordion-group">
    <div class="accordion-heading">
      <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseOne">Section 1</a>
    </div>
    <div id="collapseOne" class="accordion-body collapse in">
      <div class="accordion-inner">
      </div>
    </div>
  </div>
  <div class="accordion-group">
    <div class="accordion-heading">
      <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseTwo">Section 2</a>
    </div>
    <div id="collapseTwo" class="accordion-body collapse">
      <div class="accordion-inner">
      </div>
    </div>
  </div>
</div>

在我的应用程序.html.erb 文件中，我设置了一行代码，每 30 秒刷新一次页面。 

<meta http-equiv="refresh" content="30" >

当页面刷新时，它始终打开第一部分。有没有办法重构代码，以便在页面刷新时保持刷新前页面的状态？

通过更改以下代码行，意识到解决方案非常简单： 

<div id="collapseTwo" class="accordion-body collapse">

对此： 

<div id="collapseTwo" class="accordion-body collapse in">

刷新页面时，该部分将保持打开状态

有，但会很复杂。复杂性在于保留用户在交互期间创建的页面状态。

需要跟踪每个更改GUI状态的交互，以便在30秒后，当页面刷新时，它将清楚当前状态是什么。

为了通过页面加载来维护状态，您必须使用本地存储来保存您在交互期间收集的数据。

从整体上实现此功能并非易事。

相关文章：