jQuery 요소 선택기 문제

Question

내 문제는 다소 복잡합니다. 먼저 그것을 코딩 누군지 아니라,

$(document).ready(function() { 

    var hash = window.location.hash.substr(1); 
    var href = $('#nav li a').each(function(){ 
     var href = $(this).attr('href'); 
     if(hash==href.substr(0,href.length-5)){ 
      var toLoad = hash+'.html #content'; 
      $('#content').load(toLoad) 
     }           
    }); 

    $('#nav li a').click(function(){ 

     var toLoad = $(this).attr('href')+' #content'; 
     $('#content').hide('fast',loadContent); 
     $('#load').remove(); 
     $('#wrapper').append('<span id="load">LOADING...</span>'); 
     $('#load').fadeIn('normal'); 
     window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5); 
     function loadContent() { 
      $('#content').load(toLoad,'',showNewContent()) 
     } 
     function showNewContent() { 
      $('#content').show('normal',hideLoader()); 
     } 
     function hideLoader() { 
      $('#load').fadeOut('normal'); 
     } 
     return false; 

    }); 

}); 

가 좋아, 내가 정말 무엇을 이해하지 못하고 또한 나는 그것을 변경하려고하지만 난 성공하지 못했습니다 :

나는 다음과 같은 코드가 있습니다 . 코드는 'nav li'링크를 선택하고 페이지를 AJAX 방식으로 표시합니다. 즉, 다시로드하지 않아도됩니다. 올바르게 실행됩니다. 이제 사용자 등록을 위해 fancybox를 추가하고 싶습니다. 이렇게하려면 다음 코드를 추가해야합니다.

$("a#reg").fancybox({ 
    'hideOnContentClick': false 
}); 

은 지금은 단지 $의 document.readyfunction에서 코드를 넣어 멋진 상자에는 탐색 리 링크가 잘 작동이 정상적으로 작동합니다. 그래서 문제가 어디에 있습니까? 'nav li'링크를 클릭하면 콘텐츠가로드 된 다음 홈 링크를 다시 클릭하면 (첫 페이지로 돌아옵니다) 멋진 상자가 더 이상 작동하지 않습니다. 매우 민감하므로 이해하기 어려울 수도 있으므로 다른 방법으로 설명하겠습니다. 나는 'nav li'의 선택자와 멋진 상자 링크의 선택자를 가지고 있는데, 함께 작동시키는 가장 좋은 방법은 무엇입니까 ??

또한 누군가 코드가하는 것을 설명 할 수 있습니다.
감사합니다. (5 개 문자를

var hash = window.location.hash.substr(1); 
    var href = $('#nav li a').each(function(){ 
     var href = $(this).attr('href'); 
     if(hash==href.substr(0,href.length-5)){ 
       var toLoad = hash+'.html #content'; 
       $('#content').load(toLoad) 
     }                      
    }); 

이 첫 번째 부분은, 현재 페이지의 hash을 얻을 것이다 "탐색 리 '링크 중 하나가이 해시로 끝나는 지 확인 :

Answer 1

확인은 ... 여기 코드가하는 일입니다 예상되는 경우), 해당되는 경우 #content 페이지의 hash + ".html" 요소를 현재 페이지의 #content 요소에로드합니다 (div라고 가정합니다).

"http://.../page1.html#page2"을로드한다고 가정 해보십시오. Page1이로드되고 page1의 #content에있는 ajax 호출에 의해 page2.html의 #content가로드됩니다. 클릭하면은 "로드 메시지"를 표시하고 현재 페이지의 #content 요소에서 대상 페이지의 #content를로드

$('#nav li a').click(function(){ 

     var toLoad = $(this).attr('href')+' #content'; 
     $('#content').hide('fast',loadContent); 
     $('#load').remove(); 
     $('#wrapper').append('<span id="load">LOADING...</span>'); 
     $('#load').fadeIn('normal'); 
     window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5); 
     function loadContent() { 
       $('#content').load(toLoad,'',showNewContent()) 
     } 
     function showNewContent() { 
       $('#content').show('normal',hideLoader()); 
     } 
     function hideLoader() { 
       $('#load').fadeOut('normal'); 
     } 
     return false; 

    }); 

이

은 "탐색 리"링크가 다음 동작을 추가합니다.

왜이 스크립트가 끔찍함에도 불구하고 fancybox가 표시되지 않는 이유는 알지 못합니다. 내 생각 엔 "nav li"링크는 Ajax 호출로 내용을로드하므로 이미로드 된 fancybox에는 영향을 미치지 않지만 홈 링크를 클릭하면 페이지가 완전히 다시로드되고 fancybox 코드가 영향을받지 않습니다 이유가있다. 당신은 간단한 경고를 추가하여 그것을 확인할 수 있습니다

alert("initializing fancybox"); 
$("a#reg").fancybox({ 
    'hideOnContentClick': false 
}); 

전체 페이지가 당신이 홈 링크를 클릭하면 다시로드하고,이 경고는 팝업하지 않는 경우

, 당신은 문제의 원인을 발견했다.