问题 如何使用PJAX? (PJAX用PHP?)


我试图让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)

我可以得到一些帮助吗? 谢谢


1306
2018-04-04 01:08


起源

你的页面有一个 <section> 标签在里面?当你的服务器返回无铬内容时 X-PJAX 标题或 _pjax 搜索参数被发送?你能链接到一个演示网址吗? - Sean Hogan
实际上我无法上传PHP的东西,但我尝试了与简单的普通html文件完全相同的东西,但仍然是相同的事情。你可以在这里看到: sbtest.comoj.com - user1302430
在该测试站点中,将pjax调用替换为 $(function() { $('ul a').pjax("#main", { fragment: "#main" }); });。或者将呼叫置于页面底部。 - Sean Hogan
@Sean Hogan非常感谢你!它现在完美运作! - user1302430
我已经发布了一个答案来匹配我们的调试。如果您发现它是正确的,请接受它。 - Sean Hogan


答案:


默认情况下,pjax期望在没有chrome的情况下传递新页面 - 这是一个HTML片段,将用作容器的innerHTML。

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

无论如何,听起来你并没有提供HTML片段,而只是整个页面。这几乎违背了pjax的目的,但可以通过在下载的内容中指定片段来支持它。几乎总是这将是一个选择器,匹配将被替换的容器。

所以,假设您使用容器 @id=main 你可以用pjax调用

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

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

顺便说一下,切换到pushState辅助导航的一种更简单的方法是使用我的 HTMLDecor 项目。它需要您更改生成HTML页面的视角,但是一旦完成,您只需要将HTMLDecor.js脚本添加到页面中,并在适当时自动使用pushState - 无需配置。


10
2018-04-05 12:29