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

嗨尝试使用一个函数：

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');
                myFunction(); // FOR refresh 
            },
            error: function() {
                console.log('An error occurred');
            }
        });
    });
}

Answer 2

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

类似于：

//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();
}

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

AJAX reload page before get content

javascript

php

ajax

jquery

fullpage.js