Javascript Formstone asap.js在wordpress中的正确使用

我试图在我的wordpress站点上使用asap.js（docs:）组件。该插件随formstone提供了一组有用的脚本。但是，我不知道如何使用这个脚本正确地处理我的wordpress内容

我试过这个代码，但它没有；chrome的控制台似乎不起作用，我也没有任何错误。有谁能给我举个简单的例子，让我从中开始

jQuery(document).ready(function ($) {
var $content,
    $deferred;

$(document).ready(function() {
    // Bind ASAP events
    $(window).on("request.asap", pageRequested)
        .on("progress.asap", pageLoadProgress)
        .on("load.asap", pageLoaded)
        .on("render.asap", pageRendered)
        .on("error.asap", pageLoadError);

    $content = $(".myPageWrapper");

    // Init ASAP
    $.asap({
        cache: false,
        selector: "a:not(.no-asap)",
        transitionOut: function() {
            if ($deferred) {
                $deferred.reject();
            }

            $deferred = $.Deferred();

            $content.animate({ opacity: 0 }, 1000, function() {
                console.log("Animate complete");

                $deferred.resolve();
            });

            return $deferred;
        }
    });

    // Remember to init first page
    pageRendered();
});

function pageRequested(e) {
    // update state to reflect loading
    console.log("Request new page");
}

function pageLoadProgress(e, percent) {
    // update progress to reflect loading
    console.log("New page load progress", percent);
}

function pageLoaded(e) {
    // unbind old events and remove plugins
    console.log("Destroy old page");
}

function pageRendered(e) {
    // bind new events and initialize plugins
    console.log("Render new page");

    $content.animate({ opacity: 1 }, 1000);
}

function pageLoadError(e, error) {
    // watch for load errors
    console.warn("Error loading page: ", error);
}



});

class=“myPageWrapper”用于我的wordpress主题文件content page.php：

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>

<article class="myPageWrapper">
  <?php the_content(); ?>
 </article>
<?php endwhile; endif; ?>

---

您需要返回一个json对象，该对象只包含在发出ASAP请求时要替换的内容。我认为类似的东西在WordPress中会起作用，尽管可能有更好的方法连接到核心过滤器：

<?php 

$isASAP = (isset($_GET["fs-asap"]) && $_GET["fs-asap"] == "true");
ob_start();

if (have_posts()) : 
    while (have_posts()) : 
        the_post(); 

        if (!$isASAP) :
?>
<article class="myPageWrapper">
<?php
        endif;

        the_content(); 

        if (!$isASAP) :
?>
</article>
<?php
        endif;
    endwhile; 
endif; 

if ($isASAP) :
    // If ASAP request, return json object with page pieces
    $page_content = ob_get_clean();

    $asap_content = json_encode(array(
        ".myPageWrapper" => $page_content
    ));

    header("Content-length: " . strlen($asap_content));
    die($asap_content);
endif;
?>

感谢Ben这么快的回复！我照你说的做了，已经很晚了，所以我没有尝试改进任何东西，我会在未来几天尝试。首先，我认为页面加载速度要快得多，但我不确定是否一切正常。当我向我的站点private.js文件中添加以下内容：$.asap（“加载”）时，会发生一个无限循环，没有加载，也没有令人眼花缭乱的动画。您能看一下吗？在我的functions.php文件中，我在core.js之后添加了ad asap.js，代码如下：$.asap（“加载”，“dev.dermiclab.pl/decleor/”）；并在chrome的控制台上保留了日志，我没有捕获任何错误，它会无限刷新，没有，正如我之前写的，它没有动画，什么时候调用加载函数？如果在每次页面加载时都调用加载函数，它可能会创建一个循环。好吧，我理解你的意思，这行在my private.js中调用，所以每次都会执行ime页面加载。我应该把它放在header.php文件中吗？我想它现在可以工作了，你能确认吗？pass:dermiclab，我怎样才能为此启用动画？