如何使用 PJAX？（PJAX 与 PHP？）答案

【问题标题】：How to use PJAX? (PJAX With PHP?)如何使用 PJAX？（PJAX 与 PHP？）
【发布时间】：2012-04-17 17:14:04
【问题描述】：

我试图让 PJAX 与我的 PHP 站点一起工作，这是我正在使用的代码：

<script src="js/jquery.js"></script> 
<script src="js/jquery.pjax.js"></script>
    <script type="text/javascript">
        $(function(){
            // pjax
            $('ul a').pjax('section')
        })
    </script>

我只是使用他们在 PJAX 演示页面上使用的代码，但将他们使用的容器 (#main) 替换为我网站的容器，即 section 标签。控制台或页面上没有错误，但它也不起作用！在我使用之前

$(function() { $('ul a').pjax('section') }); 和

$('document').ready(function(){
   $('ul a').pjax('section')
});

但是当我不使用其中任何一个而只使用 $('ul a').pjax('section') 时，我会在控制台中看到此错误：

未捕获 jquery.pjax.js 中部分的 pjax 容器（行：353）

我能得到一些帮助吗？谢谢

【问题讨论】：

您的网页中是否有<section> 标记？发送 X-PJAX 标头或 _pjax 搜索参数时，您的服务器是否返回无铬内容？你能链接到演示网址吗？
实际上我无法上传 PHP 的东西，但我用简单的纯 html 文件尝试了完全相同的事情，但仍然是同样的事情。你可以在这里看到这个：sbtest.comoj.com
在该测试站点中，将您的 pjax 调用替换为 $(function() { $('ul a').pjax("#main", { fragment: "#main" }); });。或者在页面底部拨打电话。
@Sean Hogan 非常感谢！现在完美运行！
我已经发布了一个答案来匹配我们的调试。如果您认为正确，请采纳。

标签： php jquery ajax pushstate pjax

【解决方案1】：

默认情况下，pjax 期望在没有 chrome 的情况下交付新页面 - 一个 HTML sn-p 将用作容器的 innerHTML。

在您的示例中，容器将是我想的第一个 <section> 标记。我不知道 pjax 是否保证它将使用与选择器匹配的第一个元素——它可能只是替换每个匹配的元素。可能最好使用 ID 选择器，例如#main。

不管怎样，听起来您并没有提供 HTML sn-ps，而只是提供了整个页面。这几乎违背了 pjax 的目的，但是可以通过在下载的内容中指定一个片段来支持它。几乎总是这将是一个匹配将被替换的容器的选择器。

所以，假设您使用带有@id=main 的容器，您可以调用 pjax

$(function() { $("ul a").pjax("#main", { fragment: "#main" }); });

确保在文档加载后调用 pjax，否则容器查找会失败。

顺便说一句，切换到 pushState 辅助导航的更简单方法是使用我的 HTMLDecor 项目。它要求你改变你对生成 HTML 页面的看法，但是一旦你完成了，你只需将 HTMLDecor.js 脚本添加到你的页面中，并且在适当的时候会自动使用 pushState - 不需要配置。

【讨论】：