根據URL中的＃哈希值激活選項卡

Question

假設我有一個URL，例如下面的URL ......我如何激活正確的選項卡？

http://domain.com/safety.php#tabOne

我的繼承人HTML：

<div id="tabsWrapper"> 
       <div class="tabMenu"> 
       <ul class="tabset"> 
        <li><a class="tab active" href="#tabOne">Safety First</a></li> 
        <li><a class="tab" href="#tabTwo">BS8848 &amp; LoTC</a></li> 
        <li><a class="tab" href="#tabThree">Know Before You Go</a></li> 
       </ul> 
       </div> 
       <div id="tabbedContent"> 
        <section class="contentTab" id="tabOne" style="display: block;">Content here</section> 
        <section class="contentTab" id="tabTwo"> 
        <h3 style=""></h3> 
        </section> 
        <section class="contentTab" id="tabThree"> 
        <h3 style=""></h3> 
        </section> 
       </div> 
       <div class="clear"></div> 

      </div> 

和我的JQUERY：

$('.tabset>li>a').click(function(){ 
    var $tab; 
    $(this).closest('.tabset').find('>li>a.active').removeClass('active'); 
    $(this).addClass('active'); 
    $tab = $($(this).attr('href')); 
    $tab.siblings().hide(); 
    $tab.find('>div').show(); 
    $tab.fadeIn(); 
    return false; 
}); 
$('#tabbedContent').each(function(){ 
    $(this).find(':first-child').fadeIn(); 
}); 

Answer 1

使用location.hash :)！您可能需要首先去除它的#。

Answer 2

if(location.hash) { 
     $('#tabbedContent').each(function(){ 
      $(this).find("section#" + location.hash.substr(1)).fadeIn(); 
     }); 
    } else { 
     $('#tabbedContent').each(function(){ 
      $(this).find(':first-child').fadeIn(); 
     }); 
    }