Почему вызов ajax ломает jquery?

Question

РЕДАКТИРОВАТЬ # 2: Это именно то, что происходит со мной, за исключением его не WP: https://wordpress.stackexchange.com/questions/5683/loading-dynamic-content-with-ajax-breaking-jquery. Как бы я сделал это с моими сценариями ???

РЕДАКТИРОВАТЬ: реальная проблема заключается вчто когда я загружаю страницу, она работает нормально, ajax не вызывается.Но когда-то это называют.все остальные мои сценарии просто останавливаются.Как мне перезапустить скрипты после вызова ajax?Я подтвердил это из консоли Firebug.Следующая проблема также может быть причиной этого.

Ребята, я действительно прошу кого-то помочь с этим, мне нужно это исправить: (

Go здесь

Посмотрите на раздел «Текущие проекты» - список ссылок и поле определения.

Теперь перейдите к навигации, перейдите на другую страницу и вернитесь на главную страницу.Проекты не работают, элементы списка перестают быть скрытыми (скрыты JS), полоса прокрутки также не работает.

Я думаю, это потому, что ajax загружает другой div рядом с оригинальным div, и это приводит к поломке сайта.

Пример:

На странице загрузки:

<div id="main-content">
..content...
</div>

После перехода на другую страницу и возврата

<div id="main-content" class="home">
<div id="main-content" class="home">
    ..content...
</div>
</div>

Как бы я мог предотвратить это?

jQuery:

Относительно текущего раздела проекта:

$dd = $('.projects dl').find('dd'), $defBox = $('#def-box');

  $defBox.hide();
  $('.projects').hover(function(){
    $defBox.stop(true, true)
      .fadeToggle(1000)
      .html('<p>Hover The links to see a description</p>');
  });

  $dd.hide();
  $('.projects dl dt').hover(function(){
    var $data = $(this).next('dd').html();
    $defBox.html($data);
    }); 

Ajax

// Ajax Stuff 
  // Check for hash value in URL  
  var hash = window.location.hash.substr(1);

  //  Check to ensure that a link with href == hash is on the page  
  if ($('a[href="' + hash + '"]').length) {
    //  Load the page.
    var toLoad = hash + '.php #main-content';
    $('#main-content').load(toLoad);
  }
 $('nav ul li a').click(function(){
    var goingTo = $(this).attr('href');
    goingTo = goingTo.substring(goingTo.lastIndexOf('/') + 1);
    if (window.location.hash.substring(1) === goingTo) return false;

    var toLoad = $(this).attr('href')+' #main-content',
    $content = $('#main-content'), $loadimg = $('#load');

    $content.fadeOut('fast',loadContent);  
      $loadimg.remove();  
      $content.append('<span id="load"></span>');  
      $loadimg.fadeIn('slow');  
    window.location.hash = goingTo;

    function loadContent() {  
        $content.load(toLoad,'',showNewContent)  
    }  
    function showNewContent() {  
        $content.fadeIn('fast',hideLoader);  
    }  
    function hideLoader() {  
        $loadimg.fadeOut('fast');  
    }  
    return false;  

  });

Теперь я думаю, что это проблема, я неконечно, кто-нибудь может помочь?

Answer 1

Полагаю, одно из решений для вас - улучшить селектор, который вы передаете функции загрузки jQuery, чтобы он вставлял потомков # основного контента вместо себя.

Например, вы можете поместить элемент обертки в # main-content как <div id="main-content"><div id="main-content-wrapper">..., а затем измените ваши URL-адреса ajax на $(this).attr('href')+' #main-content-wrapper'.

Или я не уверен, но использование $(this).attr('href')+' #main-content > *' может работать без необходимости использования элемента-оболочки.

Answer 2

вы применяете плагин tinyscrollbar при загрузке страницы. Как только вы вернетесь на домашнюю страницу, вам нужно снова применить плагин tinyscrollbar.

когда вы загружаете страницу (http://static9.me/clients/witza/), вы делаете http://gyazo.com/038351a0773b519c3bb36ff6952dacfa.png вам нужно снова запустить этот скрипт, когда вы нажимаете home (http://static9.me/clients/witza/#home)

когда вы загружаете страницу без #home, нет ajax-запроса, чтобы получить домашний контент, верно? и сценарий находится в нижнем колонтитуле страницы. который отлично работает но когда вы нажимаете home, URL становится ... # home и вы загружаете домашний контент с помощью ajax. так что вам нужно снова применить этот плагин. попробуйте щелкнуть домашнюю ссылку в навигации и запустите сценарий tinyscrollbar в вашей консоли. ты поймешь, что я имею в виду

Answer 3

Вот решение:

http://jsbin.com/uhuci5/2/

Напишите ваш код так, а не так, как вы пытаетесь это сделать.

Answer 4

Это действительно кажется вашей проблемой. Вам нужно либо поместить этот контент в родительский контейнер, который вы будете использовать для вставки, либо вставить дочерний контейнер основного контента для home.php

Вы не хотите помещать контейнер в себя, так как это будет происходить рекурсивно без обновления страницы.