해시 태그로 팝업 윈도우 효과 만들기

URL의 해시 태그를 기반으로하는 팝업 윈도우를 시작할 수있는 스크립트를 만들고 있습니다. 사용자가 위치 표시 줄에 직접 URL + 해시를 연결하면 작동하도록 할 수 있습니다. 그러나 앵커 링크를 클릭하면 스크립트가 .load() 함수를 수행하지 않는 것처럼 보입니다. 내 시퀀싱이 잘못 되었습니까, 아니면 완전히 잘못된 방향으로 가고 있습니까?해시 태그로 팝업 윈도우 효과 만들기

<script> 
$(document).ready(function() { 
var loc = window.location.hash; 
var container = $('.container'); 
if (loc == "#content1") { $('.container').load('content1.html') } 
if (loc == "#content2") { $('.container').load('content2.html') } 
}); 
</script> 
<body> 

<ul class="navigation"> 
<li><a href="#content1">Launch content1</a></li> 
<li><a href="#content2">Launch content2</a></li> 
</ul> 

<div class="container"></div> 

</body>

출처

2010-06-29 Marc P

당신은 전화 또는 당신이 원하는 것을 얻기 위해 그 효과 window.location 또는 무언가를 사용하는 기능을 만들기 위해 중 하나가 필요합니다. jQuery 코드는 페이지가로드 된 직후에만 실행되며 해당 링크를 클릭해도 페이지가 다시로드되지 않습니다.

출처

2010-06-29 21:37:38 Jason

스크립트는 페이지가 처음로드 될 때만 실행됩니다. 해시 조각이 포함 된 앵커를 클릭하면 페이지가 다시로드되지 않으므로 $ (document) .ready ...의 스크립트가 다시 실행되지 않습니다.

http://benalman.com/projects/jquery-hashchange-plugin/는 그런 다음 사용자가 링크를 클릭하여 해시 조각을 변경하는 경우 콜백을 실행합니다 hashchange 이벤트에 작업을 결합 할 수 있습니다

나는 당신이 jQuery를 Hashchange 이벤트 플러그인을 추가 할 생각합니다. 스크립트가 다음과 같이 표시됩니다.

$(window).bind('hashchange', function() { 
pageCaller(); 
}); 

function pageCaller() { 
var loc = window.location.hash; 
var container = $('.container'); 
if (loc == "#content1") { $('.container').load('content1.html') } 
if (loc == "#content2") { $('.container').load('content2.html') } 
} 

pageCaller();

출처

2010-06-29 21:39:42 hundredwatt

고맙다. (나는 자신에게 코멘트에 더 깔끔하게 해주는 함수를 사용하여 압축 된 버전을 게시했다.) –

DRYer 코드를 포함하도록 편집 된 광산. 다행스럽게 도울 수있어! – hundredwatt

감사합니다. @hundredwatt, 플러그인이 완전히 작동했습니다. 나는 코드를 함수() 액션으로 압축했다.

$(window).bind('hashchange', function() { 
pageCaller(); 
}); 

function pageCaller() { 
var loc = window.location.hash; 
var container = $('.container'); 
if (loc == "#content1") { $('.container').load('content1.html') } 
if (loc == "#content2") { $('.container').load('content2.html') } 
} 

pageCaller();

출처

2010-06-29 22:05:07

해시 태그로 팝업 윈도우 효과 만들기

답변

관련 문제