javascript - 在获取内容之前 AJAX 重新加载页面

Question

我正在使用 FullPage.js 插件，我正在尝试使用 AJAX 在页面之间进行导航。

当我使用 .load(); 时我正在捕获我需要的页面，但是，正如我现在所看到的，我需要重新加载 fullpage.js，因为加载的页面不处于事件状态，脚本无法使用它。

这是我的代码:

$('.click a').click(function(event) {
            event.preventDefault();

            $.ajax(this.href, {

                cache: false,
                success: function(data) {
                    $('#fullpage').html($(data).find('#fullpage > *'));

                    location.search = "reloaded=1";
                    console.log('The page has been successfully loaded');
                },
                error: function() {
                    console.log('An error occurred');
                }
            });
        });

我如何刷新插件，或者我可以在使用 AJAX 获取其内容之前加载页面吗？

也许我可以加载已加载 AJAX 的页面？

Answer 1

如果您要动态创建部分或幻灯片，则需要再次销毁并初始化 fullPage.js。 为此，您需要使用 destroy('all') fullPage.js 的功能，然后再次初始化它。

类似于:

//initializing fullpage.js for the 1st time.
initFullpage();

function myFunction() {
    $('.click a').click(function (event) {
        event.preventDefault();

        $.ajax(this.href, {

            cache: false,
            success: function (data) {
                $('#fullpage').html($(data).find('#fullpage > *'));

                location.search = "reloaded=1";
                console.log('The page has been successfully loaded');

                //destroying fullpage.js completely
                $.fn.fullpage.destroy('all');

                //initializing it again so it can detect new sections.
                initFullpage();
            },
            error: function () {
                console.log('An error occurred');
            }
        });
    });
}

function initFullpage(){
     $('#fullpage').fullpage();
}