Jquery通過鏈接打開子標籤（嵌套標籤）

Question

我有主標籤和子標籤，我的問題是如何通過直接鏈接訪問子標籤。

例如：＃的mypage.html subtab2

默認我們只能訪問主選項卡。

的mypage.html＃TAB2工作..

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('.tabs').tabs(); 
     $('.subtabs').tabs(); 
    }); 

    <div class="tabs"> 
<ul> 
    <li><a href="#tab1">Tab1</a></li> 
    <li><a href="#tab2">Tab2</a></li> 
</ul> 
    <div id="tab1"> 
     <div class="subtabs"> 
      <ul> 
       <li><a href="#subtab1">Subtab1</a></li> 
       <li><a href="#subtab2">Subtab2</a></li> 
      </ul> 
     <div id="subtab1"> 
      Some content1 
     </div> 
     <div id="subtab2"> 
      Some content2 
     </div> 
     </div> 

    </div> 
    <div id="tab2"></div> 

我在，但沒有找到正確的答案搜索類似我的問題，現在我重新發布。

How to make work the jquery nested tab link?

Answer 1

正如我也在這裏How to make work the jquery nested tab link?發佈，這是我的答案/解決該問題：

我有同樣的問題。我找到了一個JS修復。請注意，在您的示例中，第一個選項卡中有子選項卡，第一個選項卡是打開的默認選項卡。通過我的修復，您可以將子選項卡放在主選項卡的任何內容中。檢查Plunker的工作示例。

http://run.plnkr.co/plunks/Wr91Bm/#subtab2

我創建的函數openParentTab()，並呼籲這一權利，我創建了$('.tabs, .subtabs').tabs();

function openParentTab() { 
    locationHash = location.hash.substring(1); 
    console.log(locationHash); 
    // Check if we have an location Hash 
    if (locationHash) { 
     // Check if the location hash exsist. 
     var hash = jQuery('#'+locationHash); 
     if (hash.length) { 
      // Check of the location Hash is inside a tab. 
      if (hash.closest(".tabContent").length) { 
       // Grab the index number of the parent tab so we can activate it 
       var tabNumber = hash.closest(".tabContent").index(); 
       jQuery(".tabs.fix").tabs({ active: tabNumber }); 
      } 
     } 
    } 
} 

後，如果你有一個大的頁面，你會發現在正確的子標籤的焦點心不是你可以添加請按照以下jQuery(".tabs.fix").tabs({ active: tabNumber });

hash.get(0).scrollIntoView(); 
setTimeout(function() { 
    hash.get(0).scrollIntoView(); 
}, 1000); 

見代碼：http://plnkr.co/Wr91Bm