Как я могу загрузить динамический контент с помощью jQuery? - PullRequest
0 голосов
/ 23 января 2011

Я следую " Как загрузить и анимировать контент с помощью 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;

    });

});

Мой сценарий

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

1 Ответ

0 голосов
/ 27 сентября 2012

Если ссылка в содержании, о котором вы говорите, является ссылкой .nav li a, то проблема здесь в том, что событие .click назначается только один раз (для documentready) и не влияет на загруженное содержимое после 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+ 
...