Javascript 引导选项卡-记住页面刷新时选择的选项卡

在页面刷新时，是否可以在嵌套选项卡中记住当前选项卡（无论是父选项卡还是子选项卡）？它基本上是水平选项卡中的垂直选项卡，如下面的HTML代码所示。它目前运行良好，但令人恼火的是，如果刷新页面，它只会跳回选项卡1

我有一小段JS，可以在页面刷新时记住当前查看的选项卡，但这只有在选项卡没有嵌套在选项卡中时才有效。我在HTML之后加入了这个作为参考

我想能够做的是返回子选项卡，例如，如果用户刷新页面，子菜单项3位于选项卡2的内部

<div class="row">
  <div class="col-lg-12">

            <ul id="userTab" class="nav nav-tabs">
              <li class="active"><a href="#tabone" data-toggle="tab">Tab One</a> </li>
              <li><a href="#tabtwo" data-toggle="tab">Tab Two</a> </li>
            </ul>

            <div id="userTabContent" class="tab-content">

                <div class="tab-pane active" id="tabone">
                    <div class="row">
                      <h3>
                      This is the content for tab one
                      <h3>
                    </div>
                </div> <!-- tabone -->

                <div class="tab-pane" id="tabtwo">
                    <div class="row">
                          <div class="col-sm-2">
                            <ul id="subtabmenu" class="nav nav-pills nav-stacked">
                              <li class="active"><a href="#subtabmenu1" data-toggle="tab"> Sub Menu Item 1</a> </li>
                              <li><a href="#subtabmenu2" data-toggle="tab"> Sub Menu Item 2</a> </li>
                              <li><a href="#subtabmenu3" data-toggle="tab"> Sub Menu Item 3</a> </li>
                              <li><a href="#subtabmenu4" data-toggle="tab"> Sub Menu Item 4</a> </li>
                            </ul>
                          </div>
                          <div class="col-sm-10">
                            <div id="subtabmenuContent" class="tab-content">
                              <div class="tab-pane active" id="subtabmenu1"> This is the content for sub menu item 1 </div>
                              <div class="tab-pane" id="subtabmenu2"> This is the content for sub menu item 2 </div>
                              <div class="tab-pane" id="subtabmenu3"> This is the content for sub menu item 3 </div>
                              <div class="tab-pane" id="subtabmenu4"> This is the content for sub menu item 4 </div>
                            </div>
                          </div>
                    </div>
                </div> <!-- tabtwo -->

            </div> <!-- userTabContent -->

  </div> <!-- col-lg-12 -->
</div> <!-- row -->

<script>
$(document).ready(function() {
    // show active tab on reload
    if (location.hash !== '') $('a[href="' + location.hash + '"]').tab('show');

    // remember the hash in the URL without jumping
    $('a[data-toggle="tab"]').on('shown.bs.tab', function(e) {
       if(history.pushState) {
            history.pushState(null, null, '#'+$(e.target).attr('href').substr(1));
       } else {
            location.hash = '#'+$(e.target).attr('href').substr(1);
       }
    });
});
</script>

这是选项卡1的内容






这是子菜单项1的内容
这是子菜单项2的内容
这是子菜单项3的内容
这是子菜单项4的内容
$（文档）.ready（函数（）{
//重新加载时显示活动选项卡
if（location.hash！=''）$（'a[href=“'+location.hash+''''']”）选项卡（'show'）；
//记住URL中的哈希值，不要跳转
$（'a[data toggle=“tab”]”）on（'show.bs.tab'，函数（e）{
if（history.pushState）{
history.pushState（null，null，'.'+$（e.target）.attr（'href'）.substr（1））；
}否则{
location.hash='#'+$（e.target）.attr（'href'）.substr（1）；
}
});
});

可能重复我刚才看到的内容，他们似乎没有提到嵌套选项卡。正如我上面所说的，我可以为标准选项卡工作，但不能为选项卡内部的选项卡工作：）