проблема выбора элемента 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», так и селектор ссылки «Причудливый бокс», что лучший способ заставить их работать вместе?

Также может кто-то объяснить мне, что делает код.
Спасибо.

Answer 1

Хорошо ... Вот что делает этот код:

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 текущей страницы, убедитесь, что один из «нав Ли» ссылки заканчивается этим хэш (5 символов ожидаемый), и если это так, загрузите элемент #content на странице hash + ".html" в элементе текущей страницы #content (я полагаю, это div).

Представьте, что вы загружаете URL-адрес «http://.../page1.html#page2». Страница1 будет загружена, а затем #content страницы2.html будет загружен вызовом ajax в #content страницы 1.

$('#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; 

    }); 

Это добавит следующее поведение «нав ли» ссылка: при нажатии показать «загрузки сообщение» и загрузить #content целевой страницы в #content элемента текущей страницы.

Я не знаю, почему этот сценарий, несмотря на ужас, заставит ваш fancybox не показывать. Я предполагаю, что ссылки «nav li» будут загружать контент с помощью вызова ajax, и это не повлияет на ваш fancybox, который уже загружен, но когда вы нажимаете главную ссылку, страница полностью перезагружается, а код fancybox не выполненный по какой-то причине. Вы можете проверить, что при добавлении простое предупреждение:

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

Если полная страница перезагружается при нажатии на ссылку на дом, и это предупреждение не всплывет, вы нашли причину вашей проблемы.