Javascript 如何在重新加载页面后保留在所选选项卡中

我正在制作一个网页。在一个页面中，我们有3个选项卡A、B和C。每个选项卡都包含一些具有动态内容的表和一个刷新按钮，用于重新加载页面（这里我们使用window.location.reload（），因为我们从数据模型中以单个转储的形式获取数据）

我面临的问题是，即使我重新加载选项卡C，我的页面也会返回到选项卡A。在重新加载之前，我需要一种方法来存储哪个选项卡处于活动状态

该选项卡在id为“mainFrame”的iframe中调用 HTML:

---

提前感谢

将活动选项卡状态存储在会话、本地存储或http请求参数中，并基于此在页面加载时隐藏/显示选项卡内容。 例如，如果是localStorage，则使用：

重新加载页面之前： setItem（“ActiveTabID”、“tab2”）

然后加载：

$(window).load(function() {
   var activeTab = localStorage.getItem("ActiveTabID");

   if(activeTab=="tab1"){
      $('#tab1Content').show();
      $('#tab2Content').hide();
      $('#tab3Content').hide();

   }else if(activeTab=="tab2"){
      $('#tab2Content').show();
      $('#tab1Content').hide();
      $('#tab3Content').hide();
   }

---

同样，tab3也显示它是否处于活动状态。

一些提示：使用本地存储。在用户切换选项卡时，而不是在页面卸载时，使用localStorage保存当前打开的选项卡。卸载事件不可靠。

$(function(){
$(window ).unload(function() {
sessionStorage.setItem("tab1", $('#tab1').checked);
sessionStorage.setItem("tab2", $('#tab3').checked);
sessionStorage.setItem("tab3", $('#tab3').checked);
});

$(window).load(function() {
if (tab1){
document.getElementById("tab1").checked="true";
} else if (tab2){
document.getElementById("tab2").checked="true";
} else if (tab3){
document.getElementById("tab3").checked="true";
}
});
});

$(window).load(function() {
   var activeTab = localStorage.getItem("ActiveTabID");

   if(activeTab=="tab1"){
      $('#tab1Content').show();
      $('#tab2Content').hide();
      $('#tab3Content').hide();

   }else if(activeTab=="tab2"){
      $('#tab2Content').show();
      $('#tab1Content').hide();
      $('#tab3Content').hide();
   }