Файл JavaScript не загружается после перехода страницы с помощью barba.js - PullRequest
Новая
       34

Файл JavaScript не загружается после перехода страницы с помощью barba.js

0 голосов
/ 12 декабря 2018

У меня есть сайт со ссылкой.Когда я нажимаю на ссылку, я хочу плавного перехода на следующую страницу с помощью jQuery.Я получил элементы HTML внутри barba DOM, чтобы они исчезли.Но когда следующая страница пытается загрузиться, все НО загружает JavaScript.

Это мой код: (index.html) 

   <div id="barba-wrapper" class="wrapper">
    <div class="barba-container">
        <div class="container">
            <span class="text1">Hey There!</span>
            <span class="text2">This is my portfolio!</span>
            <a id="homeLink" href="./home.html">Click me to continue</a>
        </div>
    </div>
</div>
<script>
    $('document').ready(function(){
        var transEffect = Barba.BaseTransition.extend({
            start: function(){
              this.newContainerLoading.then(val => this.fadeInNewcontent($(this.newContainer)));
            },
            fadeInNewcontent: function(nc) {
              nc.hide();
              console.log('stuff should be hidden');
              var $el = $(this.newContainer);
              var _this = this;
              $(this.oldContainer).fadeOut(1000).promise().done(() => {
                nc.css('visibility', 'visible');
                nc.fadeIn(1000, function(){
                console.log('new content should fade in.');
                _this.done();
                })
              });
            }
        });
        Barba.Pjax.getTransition = function() {
          return transEffect;
        }
        Barba.Pjax.start();
    });
</script>

Я вижу журналы консоли в консолино JavaScript не загружается.

Это страница, которую я пытаюсь загрузить: (home.html) 

<div id="barba-wrapper" class="wrapper">
    <div class="barba-container">
        <canvas></canvas>
        <script src="canvas.js"></script>
    </div>
</div>

Я не получаю никаких ошибок вообще.Также я видел здесь вопрос с той же проблемой, что и у меня, но это было очень непонятно.(и пока не имеет ответов) Спасибо!

1 Ответ

0 голосов
/ 25 января 2019

В Barba сценарии не оцениваются при загрузке нового контейнера.Это можно легко сделать, используя События . 

Barba.Dispatcher.on('newPageReady', function (currentStatus, oldStatus, container) {
    $(container).find('script').each(function (i, script) {
        var $script = $(script);
        $.ajax({
            url: $script.attr('src'),
            cache: true,
            dataType: 'script',
            success: function () {
                $script.trigger('load');
            }
        });
    });
});
...