'hashchange'이벤트의 기본 동작을 방지합니다.

Question

jQuery $(window).on('hashchange') 메서드를 사용하여 URI 해시가 가리키는 섹션을 제외하고 관련없는 섹션을 숨 깁니다. 그것은 아름답게, 뒤로 버튼과 모든 것을 작동합니다. 브라우저의 기본 동작을 방지 할 수 없다는 점을 제외하고는 id과 일치하는 섹션으로 스크롤하는 것입니다.

여기 내 기능입니다.

var AddHashNav = function (hashmatch, container) { 
    $(window).on('hashchange', function (e) { 
     if (!window.location.hash) { 
      // empty hash, show only the default header 
      change_preview(container, container + ' > header'); 
      return false; 
     } 
     // Don't do anything to hash links who's ids don't match 
     else if (window.location.hash.match(hashmatch)) { 
      change_preview(container, window.location.hash); 
      return false; 
     } 
    }); 
} 

var changePreview = function (container, preview) { 
    $(container + ' >').addClass('hidden'); 
    $(preview).removeClass('hidden'); 
} 

그리고 발신자가 단순히

$(document).ready(function() { 
    // applay AddHashNav to all sections who's id ends in 'preview' 
    AddHashNav(/preview?/, '.hash-nav-container'); 
}); 

둘 다 e.preventDefault(); 및 return false;을 시도하고 둘은 제대로 작동하지 않습니다. 나는 hashChange 이벤트가 아닌 click 이벤트의 동작을 방지하기 위해 노력하고있어

참고 here이 가능하지 않을 것 같다,하지만 난 적어도 누군가가이 작업을 수행하는 방법을 알아낼 수있게되었다 확신합니다.

Answer 1

AddHashNav 생성자의 첫 번째 호출에서 change_preview()을 실행하여 해결 했으므로 $(document).load() 호출에서 섹션을 숨 깁니다.

var AddHashNav = function (hashmatch, container) { 
    // hide all sections except header on load 
    change_preview() 
    $(window).on('hashchange', function (e) { 
     if (!window.location.hash) { 
      // empty hash, show only the default header 
      change_preview(container, container + ' > header'); 
      return false; 
     } 
     // Don't do anything to hash links who's ids don't match 
     else if (window.location.hash.match(hashmatch)) { 
      change_preview(container, window.location.hash); 
      return false; 
     } 
    }); 
} 

가장 아름다운 해결책은 아닙니다. 나는 그것이 왜 작동하는지 확신 할 수 없다. (왜냐하면 섹션은 윈도우 객체에 위치가 없기 때문에 스크롤 될 수 없기 때문이다.)하지만 지금은 작동한다.