Javascript 使jquery选项卡记住所选内容

我有这个jquery代码：

<script type="text/javascript">
  $(document).ready(function() {
    $(".tabLink").each(function(){
      $(this).click(function(){
        tabeId = $(this).attr('id');
        $(".tabLink").removeClass("activeLink");
        $(this).addClass("activeLink");
        $(".tabcontent").addClass("hide");
        $("#"+tabeId+"-1").removeClass("hide")   
        return false;     
      });
    });  
  });
</script>

$（文档）.ready（函数（）{
$（“.tabLink”）。每个（函数（）{
$（此）。单击（函数（）{
tabeId=$（this.attr（'id'）；
$（“.tabLink”）.removeClass（“activeLink”）；
$（this.addClass（“activeLink”）；
$（“.tabcontent”）.addClass（“隐藏”）；
$（“#”+tabeId+“-1”）.removeClass（“隐藏”）
返回false；
});
});  
});

这个HTML：

<div class="tab-box"> 
<a href="javascript:;" class="tabLink activeLink" id="companyinfo">Company</a> 
<a href="javascript:;" class="tabLink" id="contacts">Contacts</a>
</div>

<div class="tabcontent" id="companyinfo-1">
content 1 here
</div>

<div class="tabcontent" id="contacts-1">
content 2 here
</div>

这里是内容1
这里是内容2

---

如果刷新页面，将再次选择第一个选项卡。如果页面被刷新，我如何让它记住我的选择？

您可以将单击选项卡的索引保存在

localStorage

中

 // on click, save it in localStorage.selectedTab
localStorage.selectedTab = $(this).index() + 1;

// on document ready, after click handler was added search for it
if (localStorage.selectedTab) {
  $(".tabLink:eq(" + (localStorage.selectedTab - 1) + ")").click();
}

另一个解决方案是使用cookies，但我发现本地存储更容易

---

此外，您还可以使用

选项卡

API中的

活动

字段，如所述：

---

ionică-bizău答案的更紧凑的jQuery UI版本：

$("#tabs").tabs({
    activate: function( event, ui ) {
        localStorage.selectedTab = ui.newTab.index() + 1;
    },
    active: localStorage.selectedTab ? localStorage.selectedTab - 1 : 0
});

---

您可以在hidden field变量中设置当前的tab值，并在document.readyok cool中进行检查-我有很多页都有选项卡，所以我将此代码添加到一个名为jquery-tabs.php的文件中，然后使用php include“jaurey tabs.php”将此文件包含在我的所有其他页面上这还能用吗？@charlie我想你必须从

localStorage

为每个有选项卡的页面保留一个键。。。例如

localStorage[“selectedTab”+location.pathname

，然后检查它是否（localStorage[“selectedTab”+location.pathname]）{…}。

$("#tabs").tabs({
    activate: function( event, ui ) {
        localStorage.selectedTab = ui.newTab.index() + 1;
    },
    active: localStorage.selectedTab ? localStorage.selectedTab - 1 : 0
});