jQuery選項卡 - 直接轉到特定的選項卡從URL

Question

我正在使用jQuery選項卡的實現和一切工作很好，但我想能夠鏈接到一個URL例如http://www.mydomain.com/tabs.html#tab2並讓頁面自動打開選項卡2，繼承人我在迄今爲止其中http://jsfiddle.net/Jmx7k/

<script> 
jQuery(document).ready(function() { 
    jQuery('#tabs2 li a:not(:first)').addClass('inactive'); 
    jQuery('.container:not(:first)').hide(); 

    jQuery('#tabs2 li a').click(function() { 
     var t = jQuery(this).attr('href'); 
     if (jQuery(this).hasClass('inactive')) { //added to not animate when active 
      jQuery('#tabs2 li a').addClass('inactive'); 
      jQuery(this).removeClass('inactive'); 
      jQuery('.container').hide(); 
      jQuery(t).fadeIn('slow'); 
     } 
    return false; 
}) //end click 
});​ 
</script> 
    <div id="tabs2holder"> 
     <ul id="tabs2"> 
     <li><a href="#tab1">Test Tab 1</a></li> 
     <li><a href="#tab2">Test Tab 2</a></li> 
    </ul> 
</div> 

<div class="container" id="tab1"> 
    This is test content for tab1 
</div> 


<div class="container" id="tab2"> 
    This is test content for tab2 
</div> 

有人能指出我在添加此功能的正確方向，也解釋了爲什麼目前並沒有這樣做呢？

感謝

Answer 1

好吧，如果你想創建一個哈希一部分（例如「＃TAB2」）的網址，你可以用

var hash = location.hash; // hash = '#tab2' 

變化得到這個值你這樣的代碼

jQuery(document).ready(function() { 
    jQuery('#tabs2 li a:not(:first)').addClass('inactive'); 
    jQuery('.container:not(:first)').hide(); 

    jQuery('#tabs2 li a').click(function() { 
     var t = jQuery(this).attr('href'); 
     if (jQuery(this).hasClass('inactive')) { //added to not animate when active 
      jQuery('#tabs2 li a').addClass('inactive'); 
      jQuery(this).removeClass('inactive'); 
      jQuery('.container').hide(); 
      jQuery(t).fadeIn('slow'); 
     } 
     return false; 
    }); //end click 

    if (location.hash == '#tab2') { 
     // don't forget to put id-attributes to your li-elements 
     jQuery('#tablink2 a').trigger('click'); 
    } 
});​ 

另請參見：http://jsfiddle.net/Jmx7k/8/ by jsfiddle散列屬性不會影響javascript區域:-(在正常情況下嘗試它。