ハッシュアンカータブをページロード時にのみ表示

Question

ページをロードすると、アドレスバーにアンカーされたタブIDの代わりに各タブが表示されます。呼び出されたアンカーID以外のすべてがロードまたはリフレッシュ時に表示されないようにするにはどうすればよいですか？ JavaScriptを引き継ぐ前に、これは.content要素のいずれかが表示さからブラウザを防ぐことができます

<style> 
    .content { display: none; } 
</style> 

：

<script> 
//Grab hash off URL (default to first tab) and update 
$(window).bind("hashchange", function(e) { 
    var anchor = $(location.hash); 
    if (anchor.length === 0) { 
     anchor = $(".tabs div:eq(0)"); 
    } 
    updateTabs(anchor);  
}); 

//Pass in the tab and show appropriate contents  
function updateTabs(tab) {  
    $(".tabs #tab a")  
     .removeClass("active")  
     .filter(function(index) { 
      return $(this).attr("href") === '#' + tab.attr("id");  
     }).addClass("active");  
    $(".tabs .content").hide();  
    tab.show();  
} 
//Fire the hashchange event when the page first loads  
$(window).trigger('hashchange');  
</script> 

<div class="tabs"> 

    <ul> 

     <li class="tab"><a href="#div1">Tab 1</a></li> 
     <li class="tab"><a href="#div2">Tab 2</a></li> 
     <li class="tab"><a href="#div3">Tab 3</a></li> 

    </ul> 

    <div id="div1" class="content">Div 1</div> 
    <div id="div2" class="content">Div 2</div> 
    <div id="div3" class="content">Div 3</div> 
</div> 

Answer 1

なぜCSSを使用して、すべての.content要素を隠していません。

注：：ユーザーがJavaScriptを無効にしてあなたのウェブサイトにアクセスした場合、.content要素は表示されません。

Answer 2

Jqueryですべての要素を非表示にするだけです。

<script> 
    $('.content').hide(); 
</script> 

これは、各要素の誰にも負けない表示を設定しますが、JavaScriptが無効になっている場合、ユーザーはすべてのものを使用することができます。