2016-01-04 2 views
-2

я сделал AJAX запрос в сНу контейнере в моем index.php, и в одном из моей загрузки страницы с помощью AJAX У меня есть эта функция JQuery:Как вернуть jquery после загрузки ajax?

$(document).ready(function(){ 
 
\t 
 
\t var section = document.querySelector('.vs-section'); 
 
\t var divs = document.querySelectorAll('.vs-transform'); 
 
\t \t \t 
 
\t var smooth = new Smooth({ 
 
\t \t \t \t direction: 'horizontal', 
 
\t \t \t \t section: section, 
 
\t \t \t \t ease: 0.1, 
 
\t \t \t \t els: divs 
 
\t \t \t }); 
 
\t \t \t smooth.init(); 
 
});

и эта функция не если я сделаю свой запрос ajax. Но если я вставить мой

<script src="js/jquery-1.11.2.min.js"></script>

внутри этой страницы он работает, но проблема в том, я загружаю JQuery уже в моем index.php, так что загрузить его в 2 раза, так как я могу получить мой jquery работает без перезагрузки в качестве анимации?

это мой Аякса:

$(document).ready(function(){ 
 
\t 
 
    $("#menu a").click(function(){ 
 
     page=$(this).attr("href"); 
 
     $.ajax({ 
 
      url: "pages/"+page, 
 
      cache:false, 
 
      success:function(html){ 
 
       afficher(html); 
 
\t \t \t \t history.pushState({key : 'value'}, 'hash', page); 
 
      }, 
 
      error:function(XMLHttpRequest,textStatus, errorThrown){ 
 
       afficher("erreur lors du chagement de la page"); 
 
      } 
 
     }); 
 
     return false; 
 
    }); 
 
\t 
 
    $('#container').on('click', '.vs-transform a', function(){ 
 
\t var page=$(this).attr("href"); 
 
     $.ajax({ 
 
      url: "pages/"+page, 
 
      cache:false, 
 
      success:function(html){ 
 
       \t afficher(html); 
 
\t \t \t \t history.pushState({key : 'value'}, 'hash', page); 
 
      }, 
 
      error:function(XMLHttpRequest,textStatus, errorThrown){ 
 
       afficher ("erreur lors du chagement de la page"); 
 
      } 
 
     }); 
 
     return false; 
 
\t }); 
 
window.onpopstate = function(event){ 
 
\t \t if(event.state === null){ 
 
\t \t \t // alert('bien'); 
 
\t \t } 
 
\t }; 
 
}); 
 

 
\t \t 
 
function afficher(data){ 
 
$("#container").delay(100).fadeOut(400,function(){ 
 
    $("#container").empty(); \t \t \t \t 
 
    $("#container").append(data); 
 
    $("#container").fadeIn(500); \t 
 
}); 
 
}

+0

Загрузите jquery один раз в свой основной заголовок из cdn, и это не будет проблемой. –

+0

вы должны предоставить обратный вызов для успеха ajax и выполнить код для загруженной страницы ajax внутри обратного вызова. Ваш код не может работать, если вы не выполнили его после добавления html вызова ajax в DOM – AndreaG

+0

'$ (document) .ready (function() {' не требуется, если он выполняется в результате асинхронного ajax. –

ответ

0

Предположив, что функция afficher() придает загруженный код в DOM вы можете попробовать что-то вроде этого:

$('#container').on('click', '.vs-transform a', function(){ 
    var page=$(this).attr("href"); 
     $.ajax({ 
      url: "pages/"+page, 
      cache:false, 
      success:function(html){ 
       afficher(html); 
       history.pushState({key : 'value'}, 'hash', page); 
       //HERE THE INNER PAGES CODE 
       if(page==="yorpagehere.html"){  
        //here code for yourpagehere.html 
        var section = document.querySelector('.vs-section'); 
        var divs = document.querySelectorAll('.vs-transform'); 

        var smooth = new Smooth({ 
         direction: 'horizontal', 
         section: section, 
         ease: 0.1, 
         els: divs 
        }); 
        smooth.init(); 

       } 
      }, 
      error:function(XMLHttpRequest,textStatus, errorThrown){ 
       afficher ("erreur lors du chagement de la page"); 
      } 
     }); 
     return false; 
    // .... 

EDIT. Это должно работать с задержкой

$(document).ready(function(){ 

    $("#menu a").click(function(){ 
     page=$(this).attr("href"); 
     $.ajax({ 
      url: "pages/"+page, 
      cache:false, 
      success:function(html){ 
       afficher(html, page); 
       history.pushState({key : 'value'}, 'hash', page); 
      }, 
      error:function(XMLHttpRequest,textStatus, errorThrown){ 
       afficher("erreur lors du chagement de la page"); 
      } 
     }); 
     return false; 
    }); 

    $('#container').on('click', '.vs-transform a', function(){ 
    var page=$(this).attr("href"); 
     $.ajax({ 
      url: "pages/"+page, 
      cache:false, 
      success:function(html){ 
       afficher(html, page); 
       history.pushState({key : 'value'}, 'hash', page); 
      }, 
      error:function(XMLHttpRequest,textStatus, errorThrown){ 
       afficher ("erreur lors du chagement de la page"); 
      } 
     }); 
     return false; 
    }); 
window.onpopstate = function(event){ 
     if(event.state === null){ 
       // alert('bien'); 
     } 
    }; 
}); 


function afficher(data, page){ 
$("#container").delay(100).fadeOut(400,function(){ 
    $("#container").empty();     
    $("#container").append(data); 
    $("#container").fadeIn(500); 
    if(page==="yorpagehere.html"){  
     //here code for yourpagehere.html 
     var section = document.querySelector('.vs-section'); 
     var divs = document.querySelectorAll('.vs-transform'); 

     var smooth = new Smooth({ 
      direction: 'horizontal', 
      section: section, 
      ease: 0.1, 
      els: divs 
     }); 
     smooth.init(); 

     } 
}); 
} 
+0

не работает: /. – Tiaw

+0

Извините, я не видел, что вы должны сделать то же самое в функции успеха $ ("# menu a"). click() ajax. Обязательно отредактируйте yorpagehere .html с именем страницы, которую вы хотите исполнить для кода – AndreaG

+0

, да перезагрузите мое имя страницы и сделайте это для моей функции успеха ссылки меню, но все же не работайте, я не понял, что мне нужно выполнить в моей функции afficher – Tiaw

Смежные вопросы