jQuery的設置從URL

Question

活動標籤我有這個標籤系統：

$(document).ready(function(){ 
    $('#tabs div').hide(); 
    $('#tabs div:first').show(); 
    $('#tabs ul li:first').addClass('active'); 
    $('#tabs ul li a').click(function(){ 
     if($(this).parent().hasClass('active')) { 
      /** active **/ 
     } else { 
      $('#tabs ul li').removeClass('active'); 
      $(this).parent().addClass('active'); 
      var currentTab = $(this).attr('href'); 
      $('#tabs div').hide(); 
      $(currentTab).show('slide', {}, 500); 
     } 
     return false; 
    }); 
}); 

<div id="tabs"> 
     <ul> 
      <li><a href="#tab-1">1</a></li> 
      <li><a href="#tab-2">2</a></li> 
      <li><a href="#tab-3">3</a></li> 
      <li><a href="#tab-4">4</a></li> 
      <li><a href="#tab-5">5</a></li> 
     </ul> 

     <div id="tab-1"> 
Content tab1 
</div> 
<div tab2... etc 

如果我添加＃標籤-3在URL的末尾，它應該全自動顯示和設置選項卡3個活動無我有點擊它。

這是可能的一個簡單的方法？

Answer 1

看你的代碼之後，還編輯 -

，如果你在這兩條線路每次DOM已準備就緒，你總是會看到，第一個選項卡的代碼。

$('#tabs div:first').show(); 
$('#tabs ul li:first').addClass('active'); 

在決定是否顯示第一個標籤之前，您必須首先檢查'#tab'的網址。

$(function(){ 
    ... 
    var hash = window.location.hash; 
    if(hash){ 
     $('a[href="' + hash +'"]').parent('li').addClass('active'); 
     var elementID = hash.replace('#', ''); 
     $(elementID).show(); 
    } else { 
     $('#tabs div:first').show(); 
     $('#tabs ul li:first').addClass('active'); 
    } 
    ... 
} 

Answer 2

這也許應該工作：

$(window).bind('hashchange', function(event) { 
    var hash=window.location.hash; 
    if(!hash){return;} 
    $('a[href="'+hash+'"]').click(); 
});​ 
$(window).trigger('hashchange');