頁面刷新更改「選定」選項卡並顯示主選項卡。我怎樣才能保持選定的選項卡完好？

我正在使用Atlassian Javascript框架在我的頁面中創建選項卡。每次刷新頁面時，都會返回到默認選項卡並離開選定的選項卡。我在堆棧溢出中搜索相同的問題後添加了這段代碼，但它不起作用。頁面刷新更改「選定」選項卡並顯示主選項卡。我怎樣才能保持選定的選項卡完好？

<script> 
    $('#prod-discovery a').click(function (e) { 
     e.preventDefault(); 
     $(this).tab('show'); 
    }); 

    // store the currently selected tab in the hash value 
    $("ul.tabs-menu > li > a").on("shown.bs.tab", function (e) { 
     var id = $(e.target).attr("href").substr(1); 
     window.location.hash = id; 
    }); 
    $('.active').removeClass('active'); 

    // on load of the page: switch to the currently selected tab 
    var hash = window.location.hash; 
    $('#prod-discovery a[href="' + hash + '"]').tab('show'); 

</script>

這是我創建的標籤代碼：

<ul class="tabs-menu" role="tablist" id="prod-discovery"> 
     <li class="menu-item active-tab" role="presentation"> 
      <a href="#one" id="aui-uid-0-1430814803876" role="tab" aria-selected="true"><strong><h2>Tab One</h2></strong></a> 
     </li> 

     <li class="menu-item" role="presentation"> 
      <a href="#two" id="aui-uid-1-1430814803876" role="tab" aria-selected="false"><strong><h2>Tab Two</h2></strong></a> 
     </li> 

     <li class="menu-item" role="presentation"> 
      <a href="#three" id="aui-uid-1-1430814803876" role="tab" aria-selected="false"><strong><h2>Tab three</h2></strong></a> 
     </li> 

     <li class="menu-item" role="presentation"> 
      <a href="#four" id="aui-uid-1-1430814803876" role="tab" aria-selected="false"><strong><h2>Tab Four</h2></strong></a> 
     </li> 

     <li class="menu-item" role="presentation"> 
      <a href="#five" id="aui-uid-1-1430814803876" role="tab" aria-selected="false"><strong><h2>Tab5</h2></strong></a> 
     </li> 
    </ul>

僅供參考，你也可以看看到 http://jsfiddle.net/alok15ee/5wpmsqe5/1/

來源

2015-07-21 user2900150

就行了：

$('#prod-discovery a[href="' + hash + '"]').tab('show');

沒有'＃'缺失嗎？當使用substring(1)從當前選項卡中提取href值時，您將刪除散列。

儘量做到通過更換以上行的工作：

$('#prod-discovery a[href="#' + hash + '"]').tab('show');

來源

2015-07-21 12:57:22

現在我得到Uncaught TypeError：$（...）。tab不是函數 – user2900150

請問您可以在http://jsfiddle.net/api/post/library/pure/更新您的JSFiddle嗎？這是空的.. –

更新JS小提琴 – user2900150

我需要添加<div class="aui-tabs horizontal-tabs" data-aui-persist="true" role="application" id="productdiscoverytabs">確保選項卡狀態仍然存在，它使用HTML5本地存儲空間，並且還需要刪除對有源標籤類。

來源

2015-09-10 15:16:47 user2900150

頁面刷新更改「選定」選項卡並顯示主選項卡。我怎樣才能保持選定的選項卡完好？

回答

相關問題