0

这是基本代码：

<body>
<div id="barba-wrapper" class="main">
    <div class="barba-container">

        <div class="accordion">
            <div class="accord-header">link</div>
            <div class="accord-content">content</div>
        </div>

        <script src="/scripts/jquery-3.3.1.min.js"></script>
        <script src="/scripts/barba.min.js"></script>
        <script src="/scripts/scripts.js"></script>

        <script>
        $(".accordion .accord-header").click(function() {
            // for active header definition
            $('.accord-header').removeClass('on');
            $(this).addClass('on');
            // accordion actions
            if($(this).next("div").is(":visible")){
                $(this).next("div").slideUp(300);
                $(this).removeClass('on');
            } else {
                $(".accordion .accord-content").slideUp(300);
                $(this).next("div").slideToggle(300);
            }
        });
        </script>

    </div><!-- barba-wrapper -->
</div><!-- barba-container -->
</body>

问题是第一次加载页面时，手风琴工作正常。但是当您转到另一个页面然后返回时，脚本不再工作。我尝试添加到 scripts.js 的末尾：

Barba.Dispatcher.on('newPageReady', function(currentStatus, oldStatus, container) {
    eval(container.querySelector("script").innerHTML);
});

正如他们建议的那样，但没有帮助。

4

1 回答 1

0

解决了。问题是我把它放在哪里。我没有把它放在 barba 脚本的末尾，而是在之前添加了这个：

Barba.Dispatcher.on('transitionCompleted', function(currentStatus, oldStatus, container) {

            $(".accordion .accord-header").click(function() {
                // for active header definition
                $('.accord-header').removeClass('on');
                $(this).addClass('on');
                // accordion actions
                if($(this).next("div").is(":visible")){
                    $(this).next("div").slideUp(300);
                    $(this).removeClass('on');
                } else {
                    $(".accordion .accord-content").slideUp(300);
                    $(this).next("div").slideToggle(300);
                }
            });

        });

    });

}(Barba, jQuery));

重要的部分是它是在

}(Barba, jQuery));

那已经在那里结束了原始代码，而不是在那之后。

于 2019-07-18T04:10:57.460 回答