JQuery AJAX скрипт загрузки страниц не принимает относительные URL - PullRequest
0 голосов
/ 30 октября 2019

Я использую купленный шаблон HTML / Ajax и подключаю его к моей серверной части Django. Тем не менее, когда я пытаюсь использовать относительные URL (например: / contact / about-us), страница не загружается и остается пустой.

Я думаю, что это как-то связано с загрузкой страницы Ajax темы. Потому что, когда используются такие URL: contact.html & about-us.html, страницы загружаются. Проверьте демонстрацию темы здесь: http://clapat.ro/themes/tetris/index.html

Это фрагмент кода, который загружает страница Ajax:

function AjaxLoad() {       

        jQuery(document).ready(function(){
          var isAnimating = false,
            newLocation = '';
            firstLoad = false;

          //trigger smooth transition from the actual page to the new one 
          $('main').on('click', '[data-type="page-transition"]', function(event){
            event.preventDefault();
            //detect which page has been selected
            var newPage = $(this).attr('href');
            //if the page is not already being animated - trigger animation
            if( !isAnimating ) changePage(newPage, true);
            firstLoad = true;
          });

          //detect the 'popstate' event - e.g. user clicking the back button
          $(window).on('popstate', function() {
            if( firstLoad ) {
              /*
              Safari emits a popstate event on page load - check if firstLoad is true before animating
              if it's false - the page has just been loaded 
              */
              var newPageArray = location.pathname.split('/'),
                //this is the url of the page to be loaded 
                newPage = newPageArray[newPageArray.length - 1];

              if( !isAnimating  &&  newLocation != newPage ) changePage(newPage, false);
            }
            firstLoad = true;
            });

            function changePage(url, bool) {
            isAnimating = true;
            // trigger page animation
            $('body').addClass('page-is-changing');
            $('.cd-cover-layer').one('webkitTransitionEnd otransitionend oTransitionEnd msTransitionEnd transitionend', function(){
                loadNewContent(url, bool);
              newLocation = url;
              $('.cd-cover-layer').off('webkitTransitionEnd otransitionend oTransitionEnd msTransitionEnd transitionend');
            });
            //if browser doesn't support CSS transitions
            if( !transitionsSupported() ) {
              loadNewContent(url, bool);
              newLocation = url;
            }
            }

            function loadNewContent(url, bool) {
                url = ('' == url) ? 'index.html' : url;

            var section = $('<div class="cd-main-content "></div>');


            section.load(url+' .cd-main-content > *', function(event){
              // load new content and replace <main> content with the new one

                $('main').html(section);

                var clapat_title = event.match(/<title[^>]*>([^<]+)<\/title>/)[1];
                $('head title').html( clapat_title );

                $('html, body').scrollTop(0);

              //if browser doesn't support CSS transitions - dont wait for the end of transitions
              var delay = ( transitionsSupported() ) ? 30 : 0;
              setTimeout(function(){
                //wait for the end of the transition on the loading bar before revealing the new content                
                $('body').removeClass('page-is-changing');
                $('.cd-cover-layer').one('webkitTransitionEnd otransitionend oTransitionEnd msTransitionEnd transitionend', function(){
                  isAnimating = false;
                  $('.cd-cover-layer').off('webkitTransitionEnd otransitionend oTransitionEnd msTransitionEnd transitionend');
                });             

                FirstLoad();
                HeroSection();
                LazyLoad();             
                MasonryPortfolio();
                HideShowHeader();
                PageProgress();
                FooterAppear();
                Sliders();
                Lightbox();
                AppearIteam();
                BackToTop();
                ContactForm();
                CollagePlus();
                PlayVideo();                


                if( !transitionsSupported() ) isAnimating = false;
              }, delay);              
              if(url!=window.location && bool){
                window.history.pushState({path: url},'',url);
              }
                });
          }

          function transitionsSupported() {
            return $('html').hasClass('csstransitions');
          }
        });


    }// End Ajax Load

Как я могу настроить это так, чтобы он принимал относительные URL? Потому что я мало знаю о JavaScript. Вся помощь приветствуется.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...