Как загрузить динамический контент с помощью jQuery?

Question

Я следую «How to Load In and Animate Content with jQuery» и все работает нормально, но если у меня есть другие ссылки в загруженном <div/>, скрипт не работает. Может ли кто-нибудь обнаружить ошибку в следующем коде?

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

    }); 

}); 

Мой сценарий

• начало от бонитета
• нажмите кнопку 'контакт'
• контакт 'содержание ДИВ' загружается
• содержательная контакт DIV У меня есть другая ссылка «карту. html «Я хочу открыть его так же на другом, только« content div »loading -> и он не работает - сайт загружается нормально

Answer 1

Если ссылка на контент, о котором вы говорите, это ссылка .nav li a, тогда проблема в том, что событие .click присваивается только один раз (на документе уже) и не влияет на содержимое, загруженное после documentready.

Так самый простой способ будет меняться $('.nav li a').click(function(){ к

$('.nav li a').on('click', function(){ 

С помощью этого обработчика события будет приложена к содержимому загруженной позже.

---

Примечание: В зависимости от версии JQuery вы, возможно, придется использовать другой метод для этого .live поведения:

$(selector).live(events, data, handler);    // jQuery 1.3+ 
$(document).delegate(selector, events, data, handler); // jQuery 1.4.3+ 
$(document).on(events, selector, data, handler);  // jQuery 1.7+