jQuery hashchange 함수가 작동하지 않습니다.

Question

jQuery 해시 변경 함수가 작동하는 데 문제가 있습니다. 이전에 사용한 적이없는 항목이며, 원하는대로 작동하지 않는 이유를 알 수 없습니다.
6 개의 섹션이있는 '정보'페이지가 있습니다. 각 섹션은 하위 메뉴를 통해 표시/숨겨 지므로 한 번에 하나의 섹션 만 표시됩니다. 하지만 다른 페이지에서 연결할 수 있도록 해시를 첨부하고 싶습니다. 여기에 내 코드이고 나는 데 문제 설명 할 것이다 :

이

$(document).ready(function(){ 
$('.about').hide(); 
$('#section01').show(); 

$(function(){ 
$(window).on('hashchange', function(){ 
     var hash = window.location.hash; 
    $('.sub-menu').each(function(){ 
      $('.about').hide(); 
      $('#section'+$(this).attr('hook')).fadeIn(); 
      return false; 
    }); 

}); 
}); 
$(window).hashchange(); 
}); 

HTML이 :

jQuery를

<div id="content-wrap"> 


    <div id="sub-menu"> 
     <li id="sub-menu-01" class="sub-menu" hook="01"><a href="#about01">SECTION01</a></li> 
     <li id="sub-menu-02" class="sub-menu" hook="02"><a href="#about02">SECTION02</a></li> 
     <li id="sub-menu-03" class="sub-menu" hook="03"><a href="#about03">SECTION03</a></li> 
     <li id="sub-menu-04" class="sub-menu" hook="04"><a href="#about04">SECTION04</a></li> 
     <li id="sub-menu-05" class="sub-menu" hook="05"><a href="#about05">SECTION05</a></li> 
     <li id="sub-menu-06" class="sub-menu" hook="06"><a href="#about06">SECTION06</a></li> 
    </div> 


     <div id="section01" class="about"> 
CONTENT GOES HERE 
     </div> 

     <div id="section02" class="about"> 
CONTENT GOES HERE 
     </div> 

     <div id="section03" class="about"> 
CONTENT GOES HERE 
     </div>    

     <div id="section04" class="about"> 
CONTENT GOES HERE 
     </div> 

     <div id="section05" class="about"> 
CONTENT GOES HERE 
     </div> 

     <div id="section06" class="about"> 
CONTENT GOES HERE 
     </div> 

</div> 

는 그래서 .sub-menu 클릭 성공적으로 해시에게 #about01#about02 등을 추가하지만, 관련 섹션이 색이 바래지는 않고 그냥 변색되어 계속 #section01이되어 버렸습니다. 이유를 이해할 수 없습니다.
해시 변경을 도입하기 전에이 기능이 훌륭하게 작동했지만 지금은 관련 섹션이 표시되지 않고 그냥 #section01에 관계없이 .sub-menu 클릭하면 표시됩니다.

Answer 1

.attr hook을 사용하는 대신 data-hook과 .data을 사용합니다. 그건 문제가 아니야.

실제로 "후크"값이 해시와 일치하는지 결코 비교하지 않았습니다.

if ($(this).attr('hook') === hash.replace('#about', '')) { 

해시가 비어있는 경우 첫 번째 섹션을 표시해야하지만 분명히 알 수 있습니다.

http://jsfiddle.net/wkHj2/