Javascript 重新加载页面时，如何保持所选选项卡处于打开状态

这是一个侧栏菜单，直到现在每次我重新加载页面时它都会关闭选项卡，这很烦人，我应该添加什么来解决这个问题

_menu.html.erb

<div  id="mySidepanel" class="sidepanel">
 <button class="closebtn" onclick="closeNav()"><i class="fas fa-times-circle"></i></button>

    <div class="dropdown-container">
    <%= link_to "Journal", "#", class: "drop-item" %>
    <%= link_to "Stats","#", class: "drop-item" %>
    </div>

    <li class="dropdown-btn">Suppliers
      <i class="fa fa-caret-down"></i>
    </li>

    <div class="dropdown-container">
        <%= link_to "Add a supplier", "#",  class: "drop-item" %>
        <%= link_to "Suppliers", "#",  class: "drop-item" %>
    </div>

    <%= link_to "Orders", "#",  class: "list-item" %>
    <%= link_to "Users", "#",  class: "list-item" %>
</div>

---

你必须使用sessionStorage，我认为会话存储对于你想要做的事情来说已经足够了

更改选项卡时，存储选项卡his ID的值，例如：

setItem'tabId'，foo'

然后，在页面加载时，如果密钥存在，请打开选项卡。对于jQuery，应该是这样的：

$(function(){
   if (localStorage.getItem('tabId') !== null) {
      document.getElementById(localStorage.getItem('tabId')).show();
   }
}

---

给你一个主意。它并没有像现在这样干净。例如，您应该重写openNav函数以接受参数localStorage值

您可以使用localStorage跟踪用户打开的内容，然后在下次加载页面时打开这些选项卡。好的，但是如何操作？拜托？我对javascript感到很不舒服。。。我应该在我的代码中具体更改什么？别担心，我也是，但Javascript并没有那么糟糕。你的代码不能正常工作？您的控制台中有什么东西吗？请放入console.logactiveTab；if语句console.logactiveTab之前；返回Null如果有多个项目具有相同的href，则应设置数据属性或ID，这样会更干净。此外，我不确定您是否使用了正确的方法来获取单击链接的值。尝试在localStorage.setItem'activeTab'、$e.target.attr'href'之前记录$e.target.attr'href'；

$('.drop-item').on('shown.bs.tab', function (e) {
    localStorage.setItem('activeTab', $(e.target).attr('href'));
});

var activeTab = localStorage.getItem('activeTab');
if(activeTab){
    $('#mySidepanel a[href="' + activeTab + '"]').tab('show');
}

$(function(){
   if (localStorage.getItem('tabId') !== null) {
      document.getElementById(localStorage.getItem('tabId')).show();
   }
}